неизменяемое вспомогательное значение обновления объекта в массиве - PullRequest
Новая
       5

неизменяемое вспомогательное значение обновления объекта в массиве

0 голосов
/ 09 сентября 2018

Я пытаюсь понять неизменный помощник в контексте того, что я пытаюсь сделать.Я пытаюсь обновить объекты внутри, основываясь на том, когда событие 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..",
    }
  }
]

1 Ответ

0 голосов
/ 09 сентября 2018

Попробуйте это. 

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;
}
...