首页 > 解决方案 > 反应 useState 数组更新

问题描述

我已经尝试了一些事情,但我根本无法更新这个数组的状态。我确定我很接近,但有人可以看看并告诉我我做错了什么。谢谢

const [totals, setTotals] = useState({
    1: 0,
    2: 0,
    3: 0,
    4: 0,
    5: 0,
    6: 0,
    7: 0,
    8: 0,
    9: 0,
    10: 0,
    11: 0,
    12: 0
});

const handleCalculations = (key, value) => {
    setTotals({
        ...totals,
        [key]:  totals[key] + value
    });
}

标签: reactjssetstatereact-functional-component

解决方案


我怀疑你打错电话了handleCalculations。你很可能像这样使用它

<button onClick={handleCalculations}>click me</button>

结果,作为对象的事件来到了handleCalculations.

结果,你的状态变成了这样:

{
    1: 0,
    2: 0,
    3: 0,
    4: 0,
    5: 0,
    6: 0,
    7: 0,
    8: 0,
    9: 0,
    10: 0,
    11: 0,
    12: 0,
    12: 0,
    "[object Object]": null,
}

尝试将正确的参数传递给处理程序,如下所示

<button onClick={()=>handleCalculations(12,1)}>click me</button>

这应该可以解决问题。

根据您的逻辑将参数替换到函数中。


推荐阅读