Question

我是react-native的新手，我的堆栈中有两个屏幕。登录和主页。

我想通过主页上的按钮返回登录。

我正在编写这段代码

cord1

但是在登录屏幕中没有调用 componentWillMount 方法。当用户从首页进入登录屏幕时，我想重置表单。

有人可以在这里帮助我吗？

谢谢。

Answer 1

要从家中退出登录，如果屏幕紧迫在this.props.navigation.goBack()之前，则应使用home。

第二，您不应该使用componentWillMount，因为它已被弃用，并且将从 React 17 开始删除。而是使用componentDidMount

由于该组件已经安装，因此不会再次调用react生命周期事件componentDidMount。因此，您应该使用react-navigation listeners didFocus事件。

didFocus ：屏幕聚焦（如果存在过渡，则过渡完成）

componentDidMount () {
    this._onFocusListener = this.props.navigation.addListener('didFocus', (payload) => {
      // Perform the reset action here
    });
}

Answer 2

this.props.navigation.navigate('loginScreen')不起作用，因为您现在在loginScreen中。

如果要重新启动页面，则此代码不好。因为有一个循环！

正确的代码：

正好从navigate到loginScreen到home使用：

this.props.navigation.push('loginScreen')

不在“ componentWillMount”中

Answer 3

由于主屏幕和登录屏幕都在同一个StackNavigator下，因此当您从“主屏幕”返回“登录”时，状态将保持不变，并且组件不会卸载。解决此问题的推荐方法是使用反应导航的SwitchNavigator。阅读以下文档中非常有用的部分

https://reactnavigation.org/docs/en/auth-flow.html

您可能还不熟悉SwitchNavigator。的目的 SwitchNavigator一次只能显示一个屏幕。默认情况下，它不处理后退动作，并且将路由重置为其默认值离开时的状态。

Answer 4

完美的解决方案是使用this.props.navigation.push('Login')，我尝试使用SwitchNavigator，但是它不提供navigationOptions作为标头。

React-native componentWillMount不调用

4 个答案: