React Router с Redux Loop - редукторы не могут отправлять действия

Я пытаюсь перейти к предыдущему экрану после избыточного действия. я использую react-router с react-router-redux а также redux-loop,

Вот сценарий:

  1. На домашнем экране есть список пользователей /home,
  2. Нажмите на пользователя, чтобы перейти к его профилю /home/profile/1234,
  3. Измените имя пользователя и нажмите Сохранить this.props.dispatch(UserState.updateUser(id, user, history),
  4. После успешного обновления пользователя вернитесь на начальный экран. /home,

Вот некоторый код:

Посмотреть:

saveProfile = () => {
  const user = {
    name: this.state.name
  }
  this.props.dispatch(UserState.updateUser(this.state.id, user, this.props.history))
}

Действие:

export function updateUser(id, user, history) {
  return {
    type: UPDATE_USER,
    payload: {
      id,
      user,
      history
    }
  }
}

Разбавление:

case UPDATE_USER:
  return loop(
    state.updateIn(['users', action.payload.id], user => user.merge(fromJS(action.payload.user))),
    Effects.constant(action.payload.history.goBack())
  )

Это приводит к ошибке Reducers may not dispatch actions,

На другом проекте я использовал redux-saga и был в состоянии успешно передать объект истории в сагу и push/goBack. Кажется, что-то происходит с попыткой передать объект истории и вызвать его внутри redux-loop

Я работаю над POC для обновленной навигационной системы для существующего производственного приложения, поэтому работаю с redux-loop необходимо.

Любые советы / помощь будет принята с благодарностью. Пожалуйста, дайте мне знать, если я пропускаю какой-либо код, который будет полезен.

1 ответ

Решение

Я думаю, что @bradford-medeiros правильно говорит о проблеме с

Effects.constant(action.payload.history.goBack())

Это побочный эффект, поэтому он не должен происходить в редукторе. Вам не нужно передавать объект истории.

Не уверен какая версия react-router-redux у вас есть, но обычно есть действия, которые могут вызвать изменения, которые вы хотите.

import {goBack} from 'react-router-redux';


//in reducer
return loop(
   state.updateIn(['users', action.payload.id], user => user.merge(fromJS(action.payload.user))),
   Effects.constant(goBack())
);
Другие вопросы по тегам