React Native | title prop button must be string

Question

I'm using React Native Paper in my react native project and running in iOS simulator.

While clicking on Buttton I'm navigating to signup page. When I click I 'm getting below errors.

title prop button must be string

CODE:

<View style={styles.middle}>
 <Animatable.View
  animation="fadeInUpBig"
> 
<Text style={styles.textContainer}>Welcome!</Text>

<View style={styles.formArea}>
  <TextInput
    left={<TextInput.Icon name="account-hard-hat" />} ƒ
    style={styles.FormControl}
    mode="outlined"
    label="Username"
    theme={{ colors: { primary: "#007fff" } }}
    value=""
  />
  <TextInput
    left={<TextInput.Icon name="lock" />}
    right={<TextInput.Icon name="eye-off" />}
    style={styles.FormControl}
    secureTextEntry={true}
    mode="outlined"
    label="Password"
    theme={{ colors: { primary: "#007fff" } }}
    value=""
  />
   <Text style={styles.ForgotPwd}> Forgot Password? </Text>
  <Button  style={[styles.Button]} mode="contained">
    <Text style={styles.ButtonText}> Sign In </Text>
  </Button>
  <Divider style={{ marginTop: 25, marginBottom: 25, backgroundColor: "#C6C6C6" }} />
  <Text style={styles.NewAccTxt}> Don't have an account?</Text>
  <Button onPress = {() => navigation.navigate('SignUp')} style={styles.Button} mode="contained">
<Text style={styles.ButtonText}> Create new one </Text>
  </Button>
</View>
</Animatable.View>

Screenshot:

score 0 · Accepted Answer · answered Oct 23 '20 at 08:56

0

You have done this

<Button  style={[styles.Button]} mode="contained">
    <Text style={styles.ButtonText}> Sign In </Text>
  </Button>

Which wont work because React Native expects something like this

  <Button title={styles.ButtonText} style={[styles.Button]} />

Better use something like the TouchableOpacity but for button title is a required prop

answered Oct 23 '20 at 08:56

Guruparan Giritharan

15,660
4
27
50

` – Maria Jeysingh Anbu Oct 23 '20 at 09:01
did you change all button instances ? – Guruparan Giritharan Oct 23 '20 at 09:02
I commented all button but it did not work. getting same error – Maria Jeysingh Anbu Oct 23 '20 at 09:05
If you are getting the same error, you should have the button somewhere – Guruparan Giritharan Oct 23 '20 at 09:06
Yes. I was having button in signuppage – Maria Jeysingh Anbu Oct 23 '20 at 09:15
Did it work as expected after removing or changing it ? – Guruparan Giritharan Oct 23 '20 at 09:17

React Native | title prop button must be string

1 Answers1