выборка данных после использования useReducer изменяет локальное состояние - PullRequest
0 голосов
/ 10 июня 2019

Попытка переписать этот метод с помощью реакционных хуков:

this.setState({
      isPerformingAuthAction: true
    }, () => {
      auth.signInWithEmailAndPassword(emailAddress, password).then((value) => {
        this.closeSignInDialog(() => {
          const user = value.user;
          const displayName = user.displayName;
          const emailAddress = user.email;

          this.openSnackbar(`Signed in as ${displayName || emailAddress}`);
        });
      }).catch((reason) => {
        const code = reason.code;
        const message = reason.message;

        switch (code) {
          case 'auth/invalid-email':
          case 'auth/user-disabled':
          case 'auth/user-not-found':
          case 'auth/wrong-password':
            this.openSnackbar(message);
            return;

          default:
            this.openSnackbar(message);
            return;
        }
      }).finally(() => {
        this.setState({
          isPerformingAuthAction: false
        });
      });
    });

isPerformingAuthAction - это свойство компонента, которое отключает кнопки при выполнении различных действий.

<Button disabled={state.isPerformingAuthAction} ... />

Проблема: я использую useReducer для управления локальным состоянием, а isPerformingAuthAction является свойством reducerState. useReducer не возвращает обещание, поэтому я не могу сделать это:

dispatch({type:"isPerformingAuthAction", payload: true}).then(auth.stuff)

Я думал об использовании вместо этого useState, но у него нет обратного вызова, как this.setState с классами.

Я пытался обернуть голову вокруг некоторых способов использования эффекта для извлечения данных и асинхронности. Я довольно смущен этим, но я думаю, что мог бы иметь «isPerformingAuthAction» или состояние от редуктора как зависимость и использовать useEffect обновлять компонент, когда он изменяется, но свойство «isPerformingAuthAction» изменяется и по другим причинам, а не просто auth.signInWithEmailAndPassword(emailAddress, password), но signUp, signOut и несколько других.

Таким образом, когда «isPerformingAuthAction» изменяется на true, кнопки отключаются, поэтому пользователь вынужден ждать ответа от сервера. Я хочу убедиться, что эти кнопки отключены (состояние обновлено / компонент перерисован с помощью неактивных кнопок), прежде чем я вызову auth.whither.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...