使用createBottomTabNavigator将道具从一个屏幕传递到另一个屏幕

Question

我正试图通过createBottomTabNavigator将一些属性从一个屏幕传递到另一个屏幕。我正在使用反应导航。

const AppNavigator = createBottomTabNavigator({
Home: {screen: HomeScreen}, 
Map: {screen: MapScreen}
}, {
initialRouterName: 'Home',
});

在主屏幕上，我已经在componentDidMount中用this.props.navigation.setParams设置了道具，如果我在同一屏幕上检查这个.props.navigation，它就会正确显示。

componentDidMount() {
navigator.geolocation.getCurrentPosition(
position => {
const location = JSON.stringify(position);
this.props.navigation.setParams({position: location});
},
error => {
Alert.alert(error.message);
}, 
{ enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
);
}

我需要在MapScreen等其他屏幕上访问此道具，但在其他屏幕上我将为null。

我不确定这是否是正确的方式。我知道我可以用this.props.navigation.navigate发送，但正如您所看到的，我正在使用选项卡导航器，所以不确定从哪里开始。

Answer 1

我强烈建议使用redux而不是传递params。Redux旨在将属性从一个屏幕共享到另一个屏幕。

Answer 2

在像这样的家庭组件使用中，

this.props.navigation.navigate('Map',
{
name: 'Anand',
mob : '90090'
}
);

在"贴图组件"中，可以像这样使用名称。

this.props.navigation.state.params.name

在"贴图组件"中，可以像这样使用mob。

this.props.navigation.state.params.mob