Home > OS >  Text string must be rendered within a <Text> Component
Text string must be rendered within a <Text> Component

Time:06-07

<View style={styles.container}>
        <Text style={styles.textStyle}> {Math.floor(time/60).toString().padStart(2,"0")   ":"   
                    (time % 60).toString().padStart(2,"0")} </Text>{" "}
  </View>{" "}
       <View style={styles.containerbtn}>
        <TouchableOpacity style={styles.buttonStyle} onPress={()=>startTimer()}>
          <Text style={styles.buttonText}> Start </Text>{" "}
        </TouchableOpacity>{" "}
        <TouchableOpacity style={styles.buttonStyle}>
          <Text style={styles.buttonText}> Reset </Text>{" "}
        </TouchableOpacity>{" "}
  </View>{" "}

If you look the code it is giving an error but don't know what is wrong with it.

CodePudding user response:

Hey wherever you have {" "} you need to delete it since its a text and only meant for it to be rendered in Text

<View style={styles.container}>
        <Text style={styles.textStyle}> {Math.floor(time/60).toString().padStart(2,"0")   ":"   
                    (time % 60).toString().padStart(2,"0")} </Text>
  </View>
       <View style={styles.containerbtn}>
        <TouchableOpacity style={styles.buttonStyle} onPress={()=>startTimer()}>
          <Text style={styles.buttonText}> Start </Text>
        </TouchableOpacity>
        <TouchableOpacity style={styles.buttonStyle}>
          <Text style={styles.buttonText}> Reset </Text>
        </TouchableOpacity>
  </View>

Do lemme know in case of any concerns

CodePudding user response:

It is because of extra {" "} after </View> and </Text>

If you want to render space/text, it must be inside <Text>

  • Related