Text strings must be rendered within a <Text> component. (on both android and ios...running in-CodePudding

I am trying to run the below code, but it throws the error "Text strings must be rendered within a <Text> component." I am using expo as of now. It reports no logs. The log section is empty.

import React, { useState } from 'react';
import { View, StyleSheet, Text } from 'react-native';

export default function App() {
const [focusSubject, setFocusSubject] = useState(null);
return (
  <View style={styles.container}>
    focusSubject ? (
      <Text>Screen 1</Text>
    ) : (
      <Text>Screen 2</Text>
    )
  </View>
);
}

const styles = StyleSheet.create({
container: {
  flex: 1,
  backgroundColor: '#252250',
},
});

CodePudding user response：

You need to use conditions in {} .

import React, { useState } from 'react';
import { View, StyleSheet, Text } from 'react-native';

export default function App() {
const [focusSubject, setFocusSubject] = useState(null);
return (
  <View style={styles.container}>
    {focusSubject ? (
      <Text>Where am I going to build a timer</Text>
    ) : (
      <Text />
    )}
  </View>
);
}

const styles = StyleSheet.create({
container: {
  flex: 1,
  backgroundColor: '#252250',
},
});