Передача избыточного состояния в редуктор - PullRequest
0 голосов
/ 13 сентября 2018

Я пытаюсь удалить элемент из домена, нажав на него.Я сделал это без проблем, без редукса, но теперь у меня проблема.Мой редуктор не знает о состоянии.Как дать ему знать, что это за предметы?

Действие:

export function deleteItem(index) {
    return {
        type: 'DELETE_ITEM',
        index
    };
}

Мой редуктор, который показывает неопределенный.

export function deleteItem(state = [], action) {
    switch (action.type) {
        case 'DELETE_ITEM':
            const copy = state.items.slice()
            console.log(copy)
        default:
            return state;
    }
}

Вот мой фактический код https://github.com/KamilStaszewski/flashcards/tree/develop/src

Ответы [ 2 ]

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

Я видел ваш код, и вы определяете новый редуктор для каждой из операций, которые вы хотите выполнить со своими элементами (например, itemsHaveError, deleteItem, ...), но правильный способ сделать это - сохранить всесоответствующие функции для элементов в единый редуктор, который содержит данные, необходимые для изменения при каждом действии с элементами, но, как вы это делали, в любое время, когда происходит любое действие, потому что ваши редукторы разделены, исходное состояние становится пустым, как и выпереданные в функции, и редукторы не знают о связанных с ними данных, поэтому они перезаписывают их с пустым начальным состоянием, правильный путь будет таким: написать один редуктор для элементов:

    const initialState = {
      isLoading: false,
      hasError: false,
      items: [],
    };

    export default function(state = initialState, action) {
      switch (action.type) {
        case ITEMS_HAVE_ERROR:
          return {
            ...state,
            hasError: action.hasError,
          };
        case ITEMS_ARE_LOADING:
          return {
            ...state,
            isLoading: action.isLoading,
          };
        case ITEMS_FETCH_DATA_SUCCESS:
          return {
            ...state,
            items: action.items,
          };
        case DELETE_ITEM:
          const copy = state.items.slice()
          return {
            ...state,
            items: copy,
          };      
        default:
          return state;
      }
    }

, так чтобудет вашим item.js и вашим редуктором предметов, и единственным, который должен получить функцию combReducer.

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

Укажите начальное состояние редуктора по умолчанию, это пустой массив, и вы не можете получить доступ к state.items, потому что он не определен.Предположим это:

const x = [];
x.foo.slice();

, что вернет ошибку.Таким образом, с:

state = []

измените его на:

state = {
     items:[]
}

применяя его к вашему коду:

export function deleteItem(   
state = {
     items:[]
}, 
action) {
    switch (action.type) {
        case 'DELETE_ITEM':
            const copy = state.items.slice()
            console.log(copy)
        default:
            return state;
    }
}
...