Question

我将我的函数发送给callBack的子组件。在父级中，我有一个setState方法的函数：

onInputUpdated(id){
  var array = {};
  let char = id.slice(-1);
  console.log(this.state.states)
  switch(char){
    case 'a':
      array[id] = this.getY(ReactDOM.findDOMNode(this.refs[id].refs.inp).value);
      break;
    case 'b':
      array[id] = this.getX(ReactDOM.findDOMNode(this.refs[id].refs.inp).value);
      break;
  }

  let oldStates = this.state.states;
  oldStates[id] = array[id];

  this.setState({
    states: oldStates
  });
  console.log(oldStates);
}

states是一个对象。

在此之后，设置states。我可以在下一个callBack看到它，我打印到控制台。但是，不会调用render方法。在componentMount期间，所有内容都会正确呈现。

怎么办？感谢。

Answer 1

执行let oldStates = this.state.states;后，您只需将oldStates变量引用为this.state.states，这样您就可以在致电setState之前有效地更改状态。

尝试复制它，例如let oldStates = Object.assign({}, this.state.states，或者如果需要深层克隆，请使用lodash或类似的东西。

Answer 2

我认为您正在设置它然后再将其设置回来。尝试并创建一个全新的对象实例。以下是underscore的使用方法。

首先确保运行以下命令。。

npm install --save underscore

然后导入下划线。。

import _ from 'underscore';

然后克隆该对象。

let oldStates = _.clone(this.state.states);

React SetState不会调用render

2 个答案: