Используйте asyn c await в реагирующем компоненте с redux-saga - PullRequest
2 голосов
/ 30 апреля 2020

Я работаю над новым приложением RN. В моем компоненте входа в систему у меня есть следующий код:

const SignIn = ({ email, password, signInError, navigation, signInStart }: IProps) => {
  const handleLogin = async () => {
    const data = { email, password };
    await signInStart(data);

    if (signInError) {
      console.log('Error occured');
      return;
    }

    navigation.navigate(DASHBOARD_NAVIGATOR, { screen: 'Dashboard });
  };

Если signInStart (data) не удается, это устанавливает ошибку на редуктор аутентификации. Я хочу проверить это свойство избыточного состояния (signInError), чтобы перейти к пользователю, если нет ошибки. Если есть ошибка, я хочу отобразить ошибку.

Это моя сага.

function* signInStart({ payload }: any) {
  try {
    const response = yield call(AuthHttp.signIn, payload);
    const mappedResponse: IAuth = response.token;

    yield put(signInSuccess(mappedResponse));
    yield checkUserSessionStart();
  } catch (ex) {
    yield put(signInError(ex.error));
  }
}

Проблема в том, что когда я использую asyn c, ожидаю с handleLogin в компоненте входа, попробуйте часть саги работает как положено, но catch выполняется после выполнения функции handleLogin в компоненте входа.

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

...