在React中避免渲染警告

Question

在我验证用户是否是新用户时，我在React Native应用程序中收到以下警告。

Cannot update during an existing state transition (such as within渲染). Render methods should be a pure function of props and state.

这就是我想要做的

renderNewUser() {
        return (
            this.props.navigation.navigate('Welcome')
        )
    }

    render() {
        const { loadingVisible } = this.state;
        const { loading, error, me } = this.props.getMe;
        if (loading) {
            return (
                <Loader
                    modalVisible={loadingVisible}
                    animationType="fade"
                />
            )
        } else if (error) {
            return console.log
        } else {
            return (
                me.newUser ? this.renderNewUser() : <RenderListingsEmployer navigation={this.props.navigation} />
            )
        }
    }

有什么主意要逃避吗？

Answer 1

尝试这样的事情：

class Foo extends Component {
  componentDidMount() {
    if (this.props.getMe.me.newUser) {
      this.props.navigation.navigate('Welcome');
    }
  }

  render() {
    const { loadingVisible } = this.state;
    const { loading, error, me } = this.props.getMe;

    return (
      {
        loading
          ? <Loader modalVisible={loadingVisible} animationType="fade" />
          : <RenderListingsEmployer navigation={this.props.navigation} />
      }
    );
  }
}