CODEWITHSUNDEEP
javascriptreactjsreact-native
Feliks Bekeshov
Feliks Bekeshov

Reputation: 115

React Native: how to send value of TextInput in React Native?

I am trying to send value of TextInput to another screen , can someone Help me with please.. Here is my code:

  const [text, setText] = useState ( ' ');
  return (
<>
        <TextInput style={styles.input}
          underlineColorAndroid="transparent"
          placeholder="   Type "
          placeholderTextColor="#9a73ef"
          autoCapitalize="none"
          onChangeText={text => setText(text)}
          //defaultValue={text}
        />
 <Button
        title="Go to Details"
        onPress={() => navigation.navigate('Details')}
      />
-----

this is my Detais Screen:

function DetailsScreen(  {text}) {
  return (

<View>


  <Text> Hello this is Details  Screen + { text }</Text>
</View>
   
  );
}

can't take any value, even made a prop

Upvotes: 1

Views: 624

Answers (1)

Guruparan Giritharan
Guruparan Giritharan

Reputation: 16364

You should pass the parameter like below

 <Button
        title="Go to Details"
        onPress={() => navigation.navigate('Details',{text:text})}
      />

And in your details screen you should receive it like below

function DetailsScreen(  {route}) {
  return (
<View>
  <Text> Hello this is Details  Screen + { route.params.text }</Text>
</View>
  );
}

Refer the official docs

Upvotes: 2

Related Questions