Почему сплайсинг не работает правильно?

Question

Я пытаюсь удалить строки из моего списка с помощью кнопки delete .Я как этот

if (state.indexOf(action.payload) > -1) { 
     console.log('iff----') 
     state.splice(state.indexOf(action.payload), 1); 
    } 
      console.log(state) 

    return state 

но не удалить строку .Здесь мой код https://plnkr.co/edit/bpSGPLLoDZcofV4DYxPe?p=preview На самом деле с помощью кнопки добавить я генерации списка и есть кнопка удаления. Я пытаюсь удалить элемент из списка, используя delete button Не могли бы вы рассказать мне, почему он не работает?

Answer 1

Избегайте использования Array#splice при работе с государством в Реагировании или Редуксе. Это изменяет ваше состояние, которое вы никогда не хотите делать. Вместо этого поддерживайте неизменные методы, такие как Array#slice. например

const index = state.indexOf(action.payload); 
if (index === -1) { 
    return state; 
} 
return state.slice(0, index).concat(state.slice(index + 1)); 

В ES6, что последняя строка также может быть записана в виде:

return [...state.slice(0, index), ...state.slice(index + 1)];