将参数从子选项卡导航器屏幕传递到父堆栈导航器屏幕|反应原生导航答案

【问题标题】：passing params from child tab-Navigator screen to parent stack-Navigator screen | React native navigation将参数从子选项卡导航器屏幕传递到父堆栈导航器屏幕|反应原生导航
【发布时间】：2022-10-07 13:39:33
【问题描述】：

我对嵌套导航器有这个问题：我想从（儿童导航器）传递参数选项卡导航器屏幕到（父导航器）堆栈导航器带有反应导航的屏幕v6.

我的导航结构如下所示：

< STACK NAVIGATOR >:   : parent navigator 
    < some screens here .. />
   *< screen which will receive the params />
  
    < TAB NAVIGATOR >   : child navigator 
         < some screens here .. />
        *< screen which will send params />
    </ TAB NAVIGATOR** > 


</ **STACK NAVIGATOR** >

我不知道是否有内置的方式来使用 react-navigation，虽然我做了一些搜索，但在文档中什么也没找到，所以如果有任何有用的见解，我将非常感激。

当您使用navigation.navigate 或navigation.push 推送或导航到任何屏幕时，您可以发送navigation.navigate(\'ScreenName\',{params}) 之类的参数，您可以在屏幕名称中将其检索为route.params 或this.props.route.params

标签： react-native react-navigation react-native-navigation

【解决方案1】：

您可以使全局状态在子组件之外传递并确保将组件加载到屏幕是在里面 <堆栈.屏幕> /* 你的组件和传播道具如下所述 */

</Stact.Screen>

const [global,setGlobal]= useState('')


< STACK NAVIGATOR >:   : parent navigator 
      <Stack.Screen>
          {(props) => <Parent global={global} {...props} />}
      </Stack.Screen>
   *< screen which will receive the params />
  
    < TAB NAVIGATOR >   : child navigator 
/// put your component here.....
         <Tab.Screen name='Name'>
               {(props) => <Child setGlobal={setGlobal} {...props} />}
         <\Tab.Screen>

        *< screen which will send params />
    </ TAB NAVIGATOR** > 


</ **STACK NAVIGATOR** >

和你的孩子

const Child = ({setGlobal}) => {
    return <Button  onPress={()=> { setGlobal('newValue') }} />
}
export default Child

【讨论】：