嵌套的 TabNavigator 没有将参数传递给路由

Question

我有一个 TabNavigator 嵌套在 Stack Navigator 中。在登录页面中，我想导航到 TabNavigator，重置堆栈并将一些参数传递给 TabNavigator。

如文档中所述，我正在执行以下操作以重置堆栈，将 user 参数传递给导航器。

  resetAction = () => {
    return NavigationActions.reset({
      index:0,
      actions: [NavigationActions.navigate({routeName:'TabNav', params:{user: userId}})]
    })
  }

我的问题是我无法访问 TabNavigator 路由中的参数。我尝试使用 this.props.navigation.state.params 或 this.props.navigation.params，但 none 似乎有效。

我的 tabNavigator 代码：

const TabNav = TabNavigator({
    Page1:{screen: Page1},
    Page2: {screen: Page2},
    Page3: {screen: Page3}
})

Answer 1

我能够通过将 TabNav 组件更改为基于 class 的组件来解决该问题，如下所示：

export default class Dashboard extends React.Component {
  
  router = const TabNav = TabNavigator({
    Page1:{screen: Page1},
    Page2: {screen: Page2},
    Page3: {screen: Page3}
  })

  render(){
    return <TabNav screenProps={{userId: this.props.navigation.state.params.userId}}/>
  }
}

这样做我可以正常传递参数，例如 NavigationActions.navigate({routeName:'TabNav', params:{userId}} 并在 screenProps 属性的路由中访问 userId 参数，如 this.props.screenProps.userId

嵌套的 TabNavigator 没有将参数传递给路由

Nested TabNavigator not passing params to routes

react-native

react-navigation