Question

我正在尝试根据自己的意图来理解不可变的助手。我正在尝试根据onChange事件何时调用INPUT_CHANGE操作来更新内部对象。它应该添加到formData值而不是替换它。我尝试了$ add，但是那也不符合我想要的方式。同样，每次更改新的输入字段时，都会添加具有相同更新更改的新对象。

Array [index]-> input1-> INPUT_CHANGE->当输入对象改变时，使用输入字段的键和值更新对象。

inputs=[{key:{key:'input name', value: mew}}]

Array [index]-> input2-> INPUT_CHANGE->当输入字段更改时，使用输入字段的键和值更新对象。

 inputs=[{key:{key:'input name', value: mew}}, {key:{key:'input name', value: mew}}]

以此类推...

   const setupState = {
      count: 0,
      inputs: [{}],
    };

export default (state = setupState, action) => {
  switch (action.type) {
    case INPUT_CHANGE: {
      // const formDataArr = state.inputs[count];
      return update(state, {
        inputs: [{
          key: { $set: action.key },
          value: { $set: action.value },
        }],
      });
    }

    default: return state;
  }
};

对于如何为此使用不可变的助手感到困惑？

更新：这是用户更新每个输入时对象应具有的外观。

inputs: [
  {
    "score": {
      "key": "score",
      "value": "20....",
    },
    "hits": {
      "key": "hits",
      "value": "ss..",
    }
  }
]

Answer 1

尝试一下。

export default (state = setupState, action) => {
switch (action.type) {
    case INPUT_CHANGE: {
        // const formDataArr = state.inputs[count];
        return update(state, {
            inputs: [
            // contain origin state.inputs!!!!!!!!!!!!!!!!!!!
            ...state.inputs,
            {
                key: { $set: action.key },
                value: { $set: action.value },
            }],
        });
    }

    default: return state;
}

数组中对象不变的助手更新值

1 个答案: