redux 报了警告 Can't call setState on a component that is not yet mounted

Question

import React from "react";
import Store from "./store.js";
import { CHANGE_NAME } from "./actionTypes";
import { Input } from "antd";

export default class Home extends React.Component {
  constructor(props) {
    super(props);
    Store.subscribe(this.handleStoreChange);
  }

  state = Store.getState();

  onInput = e => {
    const value = e.target.value;
    Store.dispatch({ type: CHANGE_NAME, value });
  };

  handleStoreChange = () => {
    this.setState(Store.getState());
  };

  componentWillUnmount() {
    console.log("ummount");
  }

  render() {
    return (
      <div>
        <Input value={this.state.name} onChange={this.onInput} />
      </div>
    );
  }
}

控制台一直报错误：

Warning: Can’t call setState on a component that is not yet mounted. This is a no-op, but it might indicate a bug in your application. Instead, assign to this.state directly or define a state = {}; class property with the desired state in the Home component.

请问是什么原因？

react和redux都是目前最新的版本

Answer 1

Dell 2020-07-25 18:22:52

Store.subscribe(this.handleStoreChange); 写在 componentDidMount 里面

• qq_人醉梦未碎_0 #1

  这样写确实没有报错了, 为什么老师再讲解过程中 不是这样写的,却没有遇到这样的问题? 还是说插件更新了,有更规范的写法了, 学习比较晚,问题多,老师见谅

• Dell 回复 qq_人醉梦未碎_0 #2

  是的，应该是因为新版本里的实现略有改版