未定义不是对象（评估“ component.router.getStateForAction”）

Question

当我在模拟器上加载React Native应用时，我看到以下错误。它似乎与我对反应导航的使用有关。但是在搜索错误时，我找不到我想要的东西。

它正在此代码段中调用“ wrappedComponent”。

function WithAuth(WrappedComponent) {
  return class extends React.Component {
    constructor(props) {
      super(props);

      this.state = {
        ready: false,
        session: null,
      };

      this.handleOnSignIn = this.handleOnSignIn.bind(this);
      this.handleOnSignUp = this.handleOnSignUp.bind(this);
      this.handleOnSignOut = this.handleOnSignOut.bind(this);
    }

    async componentDidMount() {
      await LocalStorage.init();
      let session;
      try {
        session = await Auth.currentSession();
      } catch (err) {
        console.log(err);
        session = null;
      }
      this.setState({
        session,
        ready: true,
      });
    }

    handleOnSignIn(session) {
      this.setState({ session });
    }

    handleOnSignUp() { }

    handleOnSignOut() {
      Auth.signOut();
      this.setState({ session: null });
    }

    render() {
      const { ready, session } = this.state;
      console.log('Rendering HOC', ready, !!session);
      const {
        onSignIn,
        onSignUp,
        doSignOut,
        ...otherProps
      } = this.props;

      return (
        ready && (
          <WrappedComponent
            session={session}
            onSignIn={onSignIn || this.handleOnSignIn}
            onSignUp={onSignUp || this.handleOnSignUp}
            doSignOut={doSignOut || this.handleOnSignOut}
            auth={Auth}
            {...otherProps}
          />
        )
      );
    }
  }
}

export default WithAuth;

正在使用以下app.js代码：

Amplify.configure(awsmobile);

const App = createDrawerNavigator({
  FirstScreen: {
    screen: props => <First rootNavigator={props.navigation} screenProps={{ ...props.screenProps }} />,
    navigationOptions: {
      drawerLabel: ' ',
    },
  },
}, { initialRouteName: 'FirstScreen' });


const AppContainer = createAppContainer(props => <App screenProps={{ ...props }} />);

export default WithAuth(AppContainer);

（导出称为WithAuth。）

其中一些代码是使用react-navigation 2.0从应用程序中提取的，而我已经更新到3.0，并认为我缺少了现在需要的东西，但是我找不到它。

感谢您的帮助！

Answer 1

createAppContainer需要直接包装导航器组件。更新代码，如下所示：

Amplify.configure(awsmobile);

const App = createDrawerNavigator({
  FirstScreen: {
    screen: props => <First rootNavigator={props.navigation} screenProps={{ ...props.screenProps }} />,
    navigationOptions: {
      drawerLabel: ' ',
    },
  },
}, { initialRouteName: 'FirstScreen' });


const AppContainer = createAppContainer(App);

export default WithAuth(AppContainer);

Answer 2

将AppContainer设置为您的根组件，如下所示：

const AppContainer = createAppContainer(props => WithAuth(_ => <App screenProps={{ ...props }} />));

export default AppContainer;