React Native 在 onPress 事件上发送 2 个值，然后传递到另一个屏幕答案

【问题标题】：React Native Send 2 values on onPress event then pass to another screenReact Native 在 onPress 事件上发送 2 个值，然后传递到另一个屏幕
【发布时间】：2019-03-18 16:39:18
【问题描述】：

这是我的 JSON 文件

{
    "name": "Thịt bò",
    "noed": 5
},
{
    "name": "Thịt heo",
    "noed": 3
}

我让他们加入 Flatlist

   <FlatList
      data={cats}
      keyExtractor={item => item.name}
      renderItem={({item})=>(
          <View>
              <Text style={styles.catsItem} onPress={() => this.changeTextInput(item.name)}>{item.name} {item.noed}</Text>
          </View>
      )}
/>

但我想发送两个值是 item.name 和 item.noed 到 TextInput 然后将它们发送到另一个屏幕

changeTextInput(item){
        this.setState({name: item});
    };

但我不知道如何将item.noed 发送到 TextInput 以及如何将它们发送到另一个屏幕。我是新手，请帮帮我。

【问题讨论】：

你在用react-navigation吗？
您基本上想将用户键入的输入值存储到组件状态。查看文档：facebook.github.io/react-native/docs/textinputonChangeText={(text) => this.setState({text})}。要调试，请在渲染中记录状态以查看它是否真的保存到您的状态 `render() { console.log(this.state); return this.props.navigation.navigate("MyNextScreen", { userInput: this.state });

标签： react-native react-native-flatlist

【解决方案1】：

使用 react-navigation npm 包从一个屏幕重定向到另一个屏幕你也可以传递值

这有两个部分：

通过将参数作为第二个参数放入对象中，将参数传递给路由：

this.props.navigation.navigate
('RouteName', { /* params go here */ })




onPress={()=>this.props.navigation.navigate('Details', 
    { itemId: 86, otherParam: 'anything you want here', })};

读取屏幕组件中的参数：

this.props.navigation.getParam(paramName, defaultValue)

更多信息请阅读以下文档

React Navigation Link

【讨论】：