Question

我有一个登录组件，当用户提交登录表单时，我收到错误

警告：setState（...）：只能更新已安装或已安装零件。这通常意味着您在已卸载时调用了setState（）成分

我甚至无法找到此错误的位置

$('.Shrink').click(function() {
    $(this).parent().next().toggle();
    return false;
}).parent().next().hide();

错误究竟在哪里？

Answer 1

您正在使用该承诺调用运行此异步代码：

onSubmit = (e) => {
    e.preventDefault();
    if (this.isValid()) {
      this.setState({ errors: {}, isLoading: true });
      const loginDetails = Object.assign({}, {identifier: this.state.identifier, password: this.state.password});
      this.props.login(loginDetails).then(res => {
        console.log('res', res);
        return this.context.router.push('/');
      }).catch(error => {
        return this.setState(Object.assign({}, this.state, error, {isLoading: false}));
      });
    }
  };

因此，只要承诺失败，就会调用setState。即使您的组件不再安装，此代码也会运行。

这里有一些文档和建议可以克服承诺问题https://facebook.github.io/react/blog/2015/12/16/ismounted-antipattern.html

并且this library似乎用装饰器包装了承诺 - 我不是建议你使用它，它只是了解正在发生的事情的好方法。

顺便说一句，这是使用redux的一个很好的理由。

setState只能更新已安装或安装的组件

1 个答案: