React Native 在 onPress 事件上发送 2 个值然后传递到另一个屏幕 [英] React Native Send 2 values on onPress event then pass to another screen

问题描述

这是我的 JSON 文件

This is my JSON file

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

我把它们放到 Flatlist

I get them to 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>
      )}
/>

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

But I want to send 2 values are item.name and item.noed to TextInput then send them to another screen

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

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

But I don't know how to send item.noed to TextInput and how to send them to another screen. I'm quite new, so please help me.

推荐答案

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

Use react-navigation npm package to redirect from one screen to another screen you can also pass values

这有两个部分:

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

Pass params to a route by putting them in an object as a second parameter to the navigation.navigate function:

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




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

读取屏幕组件中的参数:

Read the params in your screen component:

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

更多信息请阅读以下文档

For more information please read the following document

React 导航链接

这篇关于React Native 在 onPress 事件上发送 2 个值然后传递到另一个屏幕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！