Question

我有两个组件，我想将一些属性数据从页面传递到其他页面/组件。但无法用道具做到这一点。

<TouchableOpacity onPress={() => {this.navigateTo('component2'); setState(url: 'www.xyz.com', data: 'abc' }>
  <View style={{ flexDirection: 'row', height: 60, justifyContent: 'center', alignItems: 'center', paddingLeft: 10 }}>
    <Image source={deals} />
    <View style={{ flex: 1 }}>
      <Text style={{ color: '#000' }}> Deal Center </Text>
    </View>
  </View>
</TouchableOpacity>

并希望从component2读取状态。任何人都可以请帮助

Answer 1

你可以编写一个导航器到1 Component和passProps的函数。

示例：

navigateTo(component){
  this.props.navigator.push({
    name: component,
    passProps: {
      url: 'www.xyz.com',
      data: 'abc' 
    }
  })
}

并将此功能放在您的代码中：

<TouchableOpacity onPress={this.navigateTo.bind(this,'component')}>
        ...
</TouchableOpacity>

在你的第二个组件中，你可以调用道具，如：

this.props.url或this.props.data

这是React Native Navigator的一个很好的教程，take a look

Answer 2

首先，你必须设置像这样的路线。

<Second navigator={navigator} {...route.passProps}  />

然后只有你可以将道具传递给第二个组件

然后点击

调用您的方法

_navigate(component,data) {
   this.props.navigator.push({
   name: component,
   passProps: {
     data:data
    }
   })
 }

在第二个组件中，您可以使用this.props.data

访问数据

组件之间的数据传输React-native

2 个答案: