更新深度嵌套反应 redux state 数组元素

Question

我有一个像这样的 redux state 阵列

[{
    client_id:12,
    template:{
     item1:[],
     item2:[],
     simple templates:[
      "Some paragraph 1",
      "Some paragraph 2",
      "Some paragraph 3",
     ]
    }
}]

所以我想使用 redux 不变性助手https://reactjs.org/docs/update.html更新simple templates数组上的元素。 例如，我想用"Some paragraph #2"更新"Some paragraph 2 " 。 我正在使用表单将要更新的数据传递给减速器。

到目前为止，我一直在尝试这样的事情

case TEMP_UPDATE_TEMPLATE: {
      console.log('index', action.payload.index); 
      console.log('data', action.payload.data); //new data that I want to update

      return update(state.simple_templates, {
        [0]: {
          template: {
            "Simple Templates": {
              [action.payload.index] : {
                $set: action.payload.data
              }
            }
          }
        }
      })
}

这对我来说真的很困惑。 请帮助我了解如何使用给定索引更新深度嵌套的 object 数组的元素。

Answer 1

尝试使用$splice而不是$set因为它是一个数组。

return update(state.simple_templates, {
  [0]: {
    template: {
      "simple templates": {
        $splice: [action.payload.index, 1, action.payload.data]
      }
    }
  }
})