Question

我在状态变量中存储了一个特定长度的数组。例如：

const [rows, setRows] = useState([1,1,1])

我有一个按钮，单击该按钮将触发一个函数，以减小此数组的长度。我为此使用array.pop()。

我正在做的是

const handleRemoveRow = () => {
    let arr = rows;
    console.log("oldArr", arr);
    arr.pop();
    console.log("newArr", arr);
    setRows(arr);
};

问题是，当我使用newArr控制台时...它会以减小的长度打印数组，这是预期的结果，但是我的状态不会更新。

我做错了。

这是复制品：-

https://codesandbox.io/s/xenodochial-lichterman-95g55?file=/src/App.js:155-306

Answer 1

您应该创建一个包含行项目的新实例数组。

由于您进行了let arr = rows的操作，因此您从rows获得了引用，并将其分配给arr

 const handleRemoveRow = () => {
    let arr = [...rows];
    console.log("oldArr", arr);
    arr.pop();
    console.log("newArr", arr);
    setRows(arr);
};

还有useEffect，您可以使用此代码：

useEffect(() => console.log("rows", rows), [rows]);

包含数组的状态未更新

1 个答案: