редуктор перестает работать после действия

Question

У меня есть база данных бэкэнда mongoose (в Express с NodeJS) с реагирующим фронтом.База данных состоит из одного аутентифицированного пользователя (используя bcrypt и jwt) и «Показывает».Шоу могут видеть все, но только прошедший проверку пользователь может публиковать / редактировать / удалять.

У меня проблемы с редактированием шоу.После того, как mongoose находит правильное шоу для редактирования и реагирует на его показ, редуктор «show» перестает работать полностью, и если я пытаюсь перезагрузить предыдущую страницу, я получаю сообщение, что show.map не является функцией.Скорее всего, это связано с тем, как я загружаю одно шоу перед его редактированием, но я попробовал все, что мог придумать (state.filter / state.find или просто action.show), но безуспешно.Я должен добавить, что если я изменю оператор return в GET_SHOW просто на «состояние», перезагрузка работает нормально (но, конечно, я не получаю шоу для редактирования).Я использую реагирующий маршрутизатор для маршрутизации, но я не думаю, что это проблема, так как все остальное работает.

редуктор выглядит так:

const show = (state = [], action) => {
switch(action.type){

    case GET_SHOW:
    return state.find(show => action.show)

    case LOAD_SHOWS:
    return [...action.shows];

    case EDIT_SHOW:
    return action.show;

    case REMOVE_SHOW:
    return state.filter(show => show._id !== action.id)

    default:
    return state;
}

}

действие, чтобы получить шоу:

 export const load = show => ({
 type: GET_SHOW,
 show
})

export const getShow = (show_id) => (dispatch, getState) =>{
let { setAdmin } = getState();
const id = setAdmin.user.id;
return apiCall("get", `/api/users/${id}/shows/${show_id}/edit`)
.then(res => dispatch(load(res)))
.catch(err => dispatch(addError(err.message)));
}

Заранее спасибо за вашу помощь!

Answer 1

Что именно вы хотите сохранить в своем объекте состояния?Больше чем одно шоу или только одно?

case GET_SHOW:
return state.find(show => action.show) -> 1

case LOAD_SHOWS:
return [...action.shows]; -> 2

case EDIT_SHOW:
return action.show; -> 3

case REMOVE_SHOW:
return state.filter(show => show._id !== action.id) -> 4

default:
return state;

1) Похоже на глючную строку.Вы вызываете find метод, который возвращает первый объект, который оценивается как истинный.

В вашем случае, если action.show верно, он вернет первый объект из массива состояний.

Рассмотрим этот пример:

const state = [ 'exampleShow1', 'exampleShow2'];
const mockAction = { type: GET_SHOW, show: 'exampleShow3'}

const result = state.find(show => mockAction.show)

Результатбудет равен 'exampleShow1'

Если вы хотите создать новый массив с данными из действия, вы можете вернуть новый массив

return [ action.show]

2) Здесь вы возвращаете новый массивиз шоу (состояние является массивом)

3) Здесь вы возвращаете только одно шоу снова (состояние является объектом)

4) Здесь вы возвращаете массив снова вместо одного шоу,(состояние - это массив)

Вам необходимо сделать ваше состояние согласованным.