Состояние Структура объекта изменено

Question

Я написал небольшое приложение toDo-list с взаимодействием с базой данных. Все работает отлично, за исключением того, что когда я пытаюсь удалить элемент toDo-list из моего состояния, структура объекта-объекта изменяется. Поэтому я больше не могу отображать свой ToDo-список во время выполнения.

Я предполагаю, что требуется небольшое изменение в моем коде редуктора, но я немного опытен с ES6 & Redux, чтобы получить его самостоятельно.

Это мой Reducer Код:

export default (state = {items: []}, action) => { 
switch (action.type){ 
    case 'RECEIVE_POSTS': 
     return Object.assign({}, state, { 
      items: action.items 
     }); 
    case 'ADD_ITEM': 
     return Object.assign({}, state, { 
      items: [ 
       ...state.items, 
       action.items 
      ] 
     }); 
    case 'REMOVE_ITEM': 
     return Object.assign({}, state, { 
      items: [ 
       state.items.filter((items, id) => id !== action.id) 
      ] 
     }); 
    default: 
     return state 
    } 
    } 

И мой DeleteItem - Действие

export default function deleteItem(id){ 
console.log("test") 
return (dispatch, getState) => { 
    return dispatch (removeItem(dispatch, id)) 
    return dispatch (receiveDelete(id)) 
    } 
} 

function removeItem(dispatch, id){ 
    return dispatch => { 
    $.ajax({ 
     method: "POST", 
     url: "http://localhost:444/localWebServices/removeTask.php", 
     data: {id: id} 
    }).success(function(msg){ 
     console.log(msg) 
     dispatch(receiveDelete(id)) 
    }); 
    } 
    } 

    function receiveDelete(id){ 
    console.log("receive add") 
    return { 
    type: 'REMOVE_ITEM', 
    id: id 
    } 
    } 

А вот два изображения структуры объекта до и после удаления элемента.

Чтобы это стало ясно. Все работает (список отображается), но после того, как я удалил элемент, структура состояния будет изменена -> List not rendered. Я не получаю сообщение об ошибке.

Перед удаления:

После удаления:

Любая помощь будет здорово!

Update:

Я изменил мой код и не возвращать массив больше. В соответствии с консолью dev состояние кажется правильным сейчас, но это не рендеринг. Этот код идет в правильном направлении?

return Object.assign({}, state, { 
      items: state.items.filter((items, id) => id !== action.id) 
     }); 

Answer 1

Аргументы передаются фильтр обратного вызова arrayElement, index, array поэтому попробуйте изменить свой обратный вызов .filter(item => item.id !== action.id)