在React Native中向对象添加新的键/值

Question

我正在开发一个React Native项目。现在，我正在向对象中添加新的键值对。

虽然它能工作，但我想知道是否有更好的方法或者你有什么建议。

我对ReactJS/React Native仍然很陌生，对Javascript的掌握也不到100%。下面是我的代码: 我的对象

state = {
    result : {
        "q1":1
    }
}

我的函数用于添加键/值和修改result状态：

_getValue = (id, value) => {

    var newObj = this.state.result;
        newObj[id] = parseInt(value);

    this.setState({
        result: newObj
    }, () => {
        console.log(this.state.result)
    })
}

感谢您！

- Clément CREUSAT

---

你所做的很好。我唯一建议更改的是将var更改为const :) 并且将this.state.result; 分配状态为 const { result } = this.state; 而不是每次调用this.state - Hemadri Dasari

它正在调用setState之前直接改变state.result，这是不同步的。这可能会导致一个非常难以捕捉的意外错误。 - Dimitar Christoff

@Dimitar他正在向现有对象添加新的键和值。这有什么问题吗？ - Hemadri Dasari

https://reactjs.org/docs/react-component.html#state - 问题也可能在于，其他某些东西可能会在排队的 setState() 更改生效之前同时引起渲染 (https://reactjs.org/docs/react-component.html#setstate - 它展示了它可能不会立即执行，而是批量或延迟到以后执行)。因此，在应该之前，应用程序的其他部分可能会获得更改的值。这样做 const result = Object.assign({}, this.state.result); 可以避免直接突变它（或扩展）。 - Dimitar Christoff

@Think-Twice他直接在原有的对象上进行修改，这样修改的部分会改变，但不变的部分会被不可变地替换掉。这没有意义。setState应该是一个不可变的更新方式。 - Ebuall

@Think-Twice 哦，没错，你是对的！我犯了错误 :-) - Clément CREUSAT

Answer 1

这应该能正常工作。

this.setState({
  result: {
     ...this.state.result,
     [id]: value
  }
});

它使用现代/新功能，例如对象展开(...this.state.result)和动态对象属性([id]: value)

- Dimitar Christoff

---

谢谢！我懂得了不变状态。我不知道为什么我这样做了……我在另一个组件中做了正确的事情，但我完全忘记了 :-) - Clément CREUSAT