如何从另一个屏幕到没有任何类且必须在react native的HeaderRight部分中设置的主屏幕中获取数据

Question

[请在下面找到用于堆栈导航的代码，在此页面中只有堆栈和抽屉导航，当我单击“页眉右”中的“提货位置”时，它将打开另一个页面（SubProductPage），它将显示所有页面地址，按该页面上的任何地址，我都必须在另一页上的“提货地点”位置显示该地址的详细信息。

操作方法

const HomeNavigation = createStackNavigator({
  HomeHomePageDrawer:HomePage,
  DeliveryDetails:{
    screen:DeliveryAddressPage,
    navigationOptions:{
      header:null
    }
  },
  SubProductPage:{
    screen:SubProductPage,
    navigationOptions:{
      header:null
    }
  }
},
{
  defaultNavigationOptions:({navigation})=>{
    return{
      headerStyle:{
        backgroundColor:'rgb(28, 34, 36)'
      },
      headerTintColor:'#fff',
      headerTitleStyle:{
        fontWeight:'bold',
        textAlign:'center',
        flex:1
      },
      headerLeft:(
        <View>
          <Icons name="md-menu" style={{fontSize:35,color:'white',paddingLeft:10}} onPress={()=>navigation.openDrawer()} />
        </View>
      ),
      headerRight:(
        <View style={{flex:1,flexDirection:'row'}} >
          <View style={{marginRight:40}}>
            <Text style={{fontSize:10,marginLeft:10,fontWeight:'200',color:'white'}}>Pickup Location</Text>
            <View>
              <TouchableOpacity style={{flexDirection:'row'}} onPress={() =>navigation.navigate('DeliveryDetails')}>
                <Text style={{fontSize:18,marginLeft:10,fontWeight:'900',color:'white',overflow:'hidden',width:230}} numberOfLines={1}>Pickup Location</Text>
                <SimpleLineIcons name="pencil" style={{fontSize:17,color:'white',paddingLeft:10}} />
              </TouchableOpacity>
            </View>
          </View>
          <MaterialIcons name="logout" style={{fontSize:30,color:'white',paddingRight:5}} onPress={() =>navigation.navigate('Auth')} /> 
        </View>
      )
    }
  }
})

单击屏幕下方的铅笔图标后将出现

点击地址后，它应该出现在接送地点

Answer 1

您可以在react-navigation中使用导航参数传递参数。

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

您可以从下面的链接中找到有关它的更多信息

https://reactnavigation.org/docs/en/params.html