在React Native屏幕之间传递数据（从屏幕A到屏幕B到屏幕C）

Question

请考虑以下情形。基本上，我们在MaterialTopTabNavigator中嵌套了一个StackNavigator。

如何将数据从函数一直传递到MaterialTopTabNavigator。请注意，MaterialTopTabNavigator必须首先通过StackNavigator

file1.js

const[test,setTest] = useState('testing');
function moveToResults(){
    navigation.navigate('Results', test)
}

[这里我们有一个简单的功能，可让该应用导航到另一个屏幕，并传递test的状态。调用moveToResults()时，我们将转到：

file2.js //注意PostFun是StackNavigator的主页。

const Tab = createMaterialTopTabNavigator();

function PostFun({navigation}) {
  return (

         <Tab.Navigator 
            initialRouteName="Feed"
            activeColor="#e91e63"
            tabBarOptions={{
                labelStyle: {fontSize:12, color:"#faa19b"},
                tabStyle: {height:65, justifyContent: "flex-end"},
            }}
            style={styles.header}>
                <Tab.Screen name="Activity" component={FindFunActivity} />
                <Tab.Screen name="Event" component={FindFunEvent} />
        </Tab.Navigator>

  );
}

File2.js是`MaterialTopTabNavigator的开始，您可以看到此导航具有两个顶部选项卡（活动和事件）。

其中一个标签可能看起来像，这是我需要显示变量的位置：

file3.js

const FindFunEvent = (navigation) =>{
return(
<View>
    <Text>{navigation.getParam()}</Text>
</View>
)

}

问题

如何获取我的test变量以显示在FindFunEvent组件中？

这比任何东西都难解释，如果您愿意，这里是视觉效果。

Here is the link to a short video that goes over the issue

Answer 1

假设您要导航并将在屏幕A中获得的值传递到屏幕B和屏幕C。你可以做这样的事情

ScreenA

this.props.navigation.navigate('ScreenB',
   {value: 'hi', });
}

屏幕B

this.props.navigation.navigate('ScreenC',
    this.props.route.params.value);
}

屏幕C

 this.props.route.params.value

Answer 2

一种简单的方法可以用于global.data。使用全局变量时，可以在应用程序中的任何位置使用它。但是，这不是理想的，因为在编程中使用全局不是最佳实践。我不确定要尝试的内容是否可行，如果不能，则可以使用global。