Javascript 如何设置嵌套对象的状态

我正在使用chartjs，并尝试使用一个API调用更新我的初始状态，如下所示：

this.state = {
      data: {
        labels: [], //<-- SET THIS STATE
        datasets: [{
            fill: 'false',
            lineTension: 0,
            label: 'Price in USD',
            data: [], //<-- SET THIS STATE
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [
                'rgba(255,99,132,1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)',
                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1
        }]
    }
}

---

您正在将标签初始化为this.state.data.labels，这很好，但随后您将其更改为timeData，我假设它在代码中的其他地方声明。如果要立即为this.state.data.labels指定新值，则不需要将标签设置为this.state.data.labels。此外，如果希望进一步简化，还可以排除line labels=timeData，只在setState调用中使用timeData

对于this.setState调用，不应向其传递函数

要回答您的问题，以下是如何设置标签状态和第二个数据属性，而不影响其余状态：

this.setState({
    data: {
        labels: timeData,
        datasets: [{
            ...this.state.data.datasets,
            data: SOME_VALUE_HERE
        }]
    }
});

---

实际上，似乎setState并没有从初始状态中继承不变的值。例如，标签，背景颜色等没有设置在状态后。我只是测试了它，它为我工作。请用您的代码创建一个JSFIDLE，我将帮助您解决问题。

let labels = this.state.data.labels
          labels = timeData
          this.setState(({data}) => ({data: {
            ...data,
            labels: labels
          }}))

this.setState({
    data: {
        labels: timeData,
        datasets: [{
            ...this.state.data.datasets,
            data: SOME_VALUE_HERE
        }]
    }
});