React Updater 功能不起作用。常规 setState 不知何故？（无法读取 null 的属性 'name'）

Question

今天学习了updater函数，因为React 16的fiber core所以用起来更好

这是不起作用的代码：

  handleChange(e) {
    this.setState((state, props) => ({
      [e.target.name]: e.target.value
    }));
  }

这里是确实有效的代码：

  handleChange(e) {
    this.setState({[e.target.name]: e.target.value});
  }

我确实像这样在构造函数中绑定了函数：

this.handleChange = this.handleChange.bind(this);

我在其中调用 handleChange 的输入如下所示：

  <input
    className="todo-input"
    type="text"
    name="newTodo"
    value={this.state.newTodo}
    onChange={this.handleChange}
  />

出于某种原因，在第二个版本中，React 抛出以下错误：

Uncaught TypeError: Cannot read property 'name' of null

有人可以向我解释一下我的代码有什么问题吗？

PS：我从 this 博文中了解了更新程序功能。

Answer 1

试试这个：

handleChange(e) {
  e.persist();

  this.setState((state, props) => ({
    [e.target.name]: e.target.value
  }));

}

或者这个：

handleChange(e) {

  const value = e.target.value;
  const name = e.target.name;

  this.setState((state, props) => ({
    [name]: value
  }));

}

React Updater function doesn't work. Regular setState somehow does? (Cannot read property 'name' of null)