Redux Форма отправки проверки с избыточным Thunk - PullRequest
0 голосов
/ 31 мая 2019

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

Есть ли какая-нибудь помощь, как это сделать?

Submit.js

onSubmit = data => {
    const { saveUser, validateEmail, emailValidate } = this.props;
    validateEmail(data.email); // action create for api request
    console.log(emailValidate); // fetch data in reducer(This data is empty because code run before reducer set state)
    if (emailValidate.statusMessage === 'OK') {
      throw new SubmissionError({ email: 'Email already in use', _error: 'Login failed!' });
    } else {

    }
  }

const mapDispatchToProps = (dispatch) => {
    validateEmail(email) {
      dispatch(validateEmail(email));
    },
  };
};
const mapStateToProps = (state) => ({
  emailValidate: state.registrationFormEmailValidate.data,
});

1 Ответ

0 голосов
/ 31 мая 2019
onSubmit = data => {
  const { saveUser, validateEmail, emailValidate } = this.props;
  validateEmail(data.email); // action create for api request
}

componentDidUpdate(prevProps) {
  // Typical usage (don't forget to compare props):
  if (this.props.emailValidate.statusMessage !== prevProps.emailValidate.statusMessage) {
    console.log(this.props.emailValidate);
    if (this.props.emailValidate.statusMessage === 'OK') {
      throw new SubmissionError({ email: 'Email already in use', _error: 'Login failed!' });
    } else {

    }
  }
}

Если вы используете class component, вы можете использовать componentDidUpdate()

...