如何更新嵌套的useState？

Question

嘿，我在更新 useState 时遇到问题。 我看到了一些例子，但是在尝试实现它时它不起作用。任何人都可以帮我解决这个小问题吗？

这是原始 state，我需要更新标签

        setChartData({
            labels: [ ],
            datasets:[
            {
                label:'Sales',
                data:[ //values for population num
                    
                ],
                backgroundColor:[
                    'rgba(255, 99, 132, 0.6)',
                    'rgba(54, 162, 235, 0.6)',
                    'rgba(255, 206, 86, 0.6)',
                    'rgba(75, 192, 192, 0.6)',
                    'rgba(153, 102, 255, 0.6)',
                    'rgba(255, 159, 64, 0.6)',
                    'rgba(255, 99, 132, 0.6)'
                ]
            }
            ]
        })

这是我试图分配给标签数组的数组

        for (let y = 0; y < weeks.length; y++) {
            setChartData(prevState => ({
                ...prevState,
                labels: {
                    ...prevState.labels,
                    weeks[y]
                }
            }))
        }

Answer 1

糟糕：您在循环中使用了错误的大括号！ 尝试这个：

for (let y = 0; y < weeks.length; y++) {
  setChartData((prevState) => ({
    ...prevState,
    labels: /* { */ [
      ...prevState.labels,
      weeks[y]
    ] /* } */
  }));
}

您正在使用无效语法将您的labels数组替换为 object，这可能是您的本意。

Answer 2

尝试不将prevState作为回调中的参数，如下所示：

for (let y = 0; y < weeks.length; y++) {
            setChartData(() => ({
                ...chartData //or whatever you called your state variable.
                labels: {
                    ...chartData.labels,
                    weeks[y]
                }
            }))
        }