如何将变量设置为空数组

Question

我正在尝试编写一个函数，从名为selectedItems 的数组中删除所有元素。

看起来像这样：

  const selectNone = (e: any) => {

    let selectedItemsCopy = selectedItems;
    selectedItemsCopy = []

    setState(
      {
        ...state,
        areAllSelected: false,
        isChecked: false,
        selectedItems: selectedItemsCopy
      }
    );
  }

但在 setState 中，selectedItems 不会更新为数组的空副本。我做错了什么？

Answer 1

你遇到的问题是，你实际上是在改变状态，这在 React 中基本上是被禁止的。这种情况，解决起来很简单，直接把[]放在setState里面，不带任何变量：

  const selectNone = (e: any) => {
    setState(
      {
        ...state,
        areAllSelected: false,
        isChecked: false,
        selectedItems: []
      }
    );
  }

您用于复制数组的方法实际上并不复制数组，而是创建对原始数组的引用（这就是 JS 的工作方式）。为了制作正确的副本（例如能够进行修改，而不仅仅是清除数组），您应该使用Array.from()。

这是一个例子

  const selectNone = (e: any) => {

    let selectedItemsCopy = Array.from(selectedItems);
    selectedItemsCopy[x] = changedValue;

    setState(
      {
        ...state,
        areAllSelected: false,
        isChecked: false,
        selectedItems: selectedItemsCopy
      }
    );
  }