将道具传递给 createSwitchNavigator 会破坏 createAppContainer

Passing props to createSwitchNavigator breaks createAppContainer

以下代码在我的 expo React Native 项目中运行良好:

const AppNavigator = createSwitchNavigator({
    Loading:Loading,
    Auth: AuthenticationNavigator,
    Main: MainNavigator
});

const AppContainer = createAppContainer(AppNavigator);

class App extends React.Component {
    render() {
        return <AppContainer/>
    }
}

我想将 screenProps 添加到我的 createSwitchNavigator。我用了this example。这是我的代码:

const AppNavigator = createSwitchNavigator({
    Loading:Loading,
    Auth: AuthenticationNavigator,
    Main: MainNavigator
});
const AppNavigatorWithProps=(<AppNavigator screenProps={{testing:true}} />)

const AppContainer = createAppContainer(AppNavigatorWithProps);

class App extends React.Component {
    render() {
        return <AppContainer/>
    }
}

我收到以下错误:

TypeError: undefined is not an object (evaluating 'Component.router.getStateForAction')

This error is located at:
    in NavigationContainer (at App.js:42)
    in App (at withExpoRoot.js:22)
    in RootErrorBoundary (at withExpoRoot.js:21)
    in ExpoRootComponent (at renderApplication.js:34)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
    in AppContainer (at renderApplication.js:33)

我做错了什么?

class App extends React.Component {
  render() {
    return <AppContainer screenProps={{ testing: true }} />
   }
 }

像这样

你不需要用 createAppContainer 或其他任何东西包裹 AppNavigator

直接用周代回答如下:

class App extends React.Component {
    render() {
        return <AppNavigator screenProps={{
          //pass any object you need for ex
          testing:true
        }}/>
    }
}

但我添加了另一个关于使用道具的信息,如下所示:

要访问这些道具,您只需使用:

console.log(this.props.screenProps.testing)

createSwtichNavigator

中定义的任何屏幕上

例如在您的代码中:

Loading, Auth, and Main应该得到道具

class Loading extends React.Component {
    componentWillMount(){
      console.log(this.props.screenProps.testing)
    }
    render() {
        return (<View/>)
    }
}

Note: I have test the code using React Navigation V2