Обновление состояния Redux не вызывает компонент componentWillReceiveProps

Я пытаюсь проверить регистрационную информацию. Убедившись, что логин действителен, я хочу запустить новый маршрут. Я передаю state.loginReducer.login как реквизит. Когда я обрабатываю событие отправки, отправляется действие, изменяя глобальное состояние входа.

Не следует ли в этом случае увольнять ComponentWillReceiveProps? так как реквизит изменился?. Есть ли лучший способ реализовать эту функциональность?

handleSubmit (evt) {
    const {
        dispatch,
        login
    } = this.props;

    dispatch(actions.doLogin(value.login));
}

ComponentWillReceiveProps (nextprops) {
    const {
        login
    } = this.nextProps;

    if (login != null) {
        history.pushState({}, '/account');
    }
}

function mapStateToProps (state) {
    return {
        login: state.loginReducer.login
    }
}

export default connect(mapStateToProps)(Login);

Ответы

Ответ 1

Если state.loginReducer.login изменится, тогда будет срабатывать componentWillReceiveProps. Если вы считаете, что ваш редуктор возвращает новое состояние, а componentWillReceiveProps не запускается, убедитесь, что новое состояние является неизменным. Возврат той же справки состояния, которая передается редуктору, не будет работать.

Из http://rackt.org/redux/docs/Troubleshooting.html:

Это неправильно:

function todos(state = [], action) {
  switch (action.type) {
  case 'ADD_TODO':
    // Wrong! This mutates state
    state.push({
      text: action.text,
      completed: false
    });
  case 'COMPLETE_TODO':
    // Wrong! This mutates state[action.index].
    state[action.index].completed = true;
  }

  return state;
}

Это правильно:

function todos(state = [], action) {
  switch (action.type) {
  case 'ADD_TODO':
    // Return a new array
    return [...state, {
      text: action.text,
      completed: false
    }];
  case 'COMPLETE_TODO':
    // Return a new array
    return [
      ...state.slice(0, action.index),
      // Copy the object before mutating
      Object.assign({}, state[action.index], {
        completed: true
      }),
      ...state.slice(action.index + 1)
    ];
  default:
    return state;
  }
}

Ответ 2

ComponentWillReceiveProps (nextprops) должно быть componentWillReceiveProps (nextprops)

"C" должен быть строчным. Фактически, mapStateToProps запускает componentWillReceiveProps. Я в этом уверен.