如何在 redux 中更新 object 内的数组

Question

我有一个数组，我现在正在为 redux 编写代码。

const initialState = [{ id: '1', title: '', description: '' }];

我想像这样更新那个数组

[{ id: '1', title: '', description: '' },{ id: '2', title: '', description: '' }];

复制后我想将 id 的副本更新为“2”

这是我试过的

    case COPY_QUESTION: {
      const copyQuestion = state.find(question => question.id === action.payload)
      copyQuestion?.id = (state.length + 1).toString()
      return [...state, copyQuestion];
    }

它对我不起作用。 如果我尝试更改 id，0 索引也会同时更改。 像这样

[{ id: '2', title: '', description: '' },{ id: '2', title: '', description: '' }];

感谢您阅读此问题，我将非常感谢您的帮助。

Answer 1

这样的事情应该有效：

const initialState = [{ id: '1', title: '', description: '' }];

const copyInitialState = [...initialState]

copyInitialState.push({ id: parseInt(copyInitialState[copyInitialState.length - 1].id, 10) + 1, title: '', description: '' })

//setState

copyInitialState 则等于：

[
 {
  id:"1",
  title:"",
  description:""
 },
 {
  id:2,
  title:"",
  description:""
 }
]

Answer 2

JavaScript 通过引用处理对象，因此“查找”仅返回已存在的 object 的 memory 中的地址，然后您可以对其进行操作。

您必须首先克隆您的 object，例如使用传播运算符（不适用于深度克隆）：

const originalQuestion = state.find(question => question.id === action.payload)
const copyQuestion = { ...originalQuestion }

查看这个 SO 问题以获得更多上下文和可能性。