ReactNative State 不會立即改變，所以我該如何解決我的問題？

Question

我在 reactNative 中處理 setState() 時遇到問題。

在“登錄”模塊中，如果“用戶名”與 email 地址相關聯，我需要檢查 Firebase。 如果是這種情況，則對用戶進行身份驗證。 如果不是，我會發出警告說“用戶名與 email 不匹配。

那么，我的問題是什么？ 當用戶名不依賴於 email 時，它會起作用並顯示警告對話框。 當用戶名與 email 匹配時，它可以工作，但是當我單擊“連接器”按鈕時，它仍然顯示警報。

我該如何在我的代碼中解決這個問題？

class ModalLogin extends React.Component {
state = {
email: '',
password: '',
pseudo: '',
items: [],
find: '',
iconEmail: require('../Images/icon-email.png'),
iconPassword: require('../Images/icon-password.png'),
iconName: require('../Images/name.png'),
isSuccessful: false,
isLoading: false,
scale: new Animated.Value(1),
translateY: new Animated.Value(0),
top: new Animated.Value(screenHeight),
};

handleLogin = () => {
const email = this.state.email;
const password = this.state.password;
const pseudo = this.state.pseudo;

if ((pseudo != '') & (email != '') & (password != '')) {
  let user_pseudo = firebase.database().ref('/users');

  user_pseudo.once('value').then(snapshot => {
    snapshot.forEach(el => {
      if (
        pseudo === el.val().username &&
        email.toLowerCase() === el.val().email
      ) {
        this.state.find = true;
        this.setState({find: true}, () => {
          this.setState({isLoading: true});
          firebase
            .auth()
            .signInWithEmailAndPassword(email, password)
            .catch(error => {
              if (error.code === 'auth/user-not-found') {
                this.handleSingin().bind(this);
              } else Alert.alert('Error', error.message);
            })
            .then(response => {
              this.setState({isLoading: false});

              if (response) {
                // Successful
                this.setState({
                  isSuccessful: true,
                });
                //storage

                this.storeName(this.state.user);
                //this.fetchUser();
                this.props.updateName(this.state.user);

                setTimeout(() => {
                  Keyboard.dismiss();
                  this.props.closeLogin();
                  this.setState({
                    isSuccessful: false,
                  });
                }, 1000);
              }
            });
          this.setState({isLoading: false});
        });
      }
    });
  });



if (this.state.find == false) {
        Alert.alert('Le pseudo ne correspond pas à son adresse email !');
        // it means no username corresponds to this email address
      }
} else {
  console.log('erreur null');
  Alert.alert(
    'Error',
    "login/password don't match!",
  );
 }
};

先感謝您 ！！

Answer 1

好的，這不是反應問題，它只是 javascript

if (this.state.find == false) {
          Alert.alert('Le pseudo ne correspond pas à son adresse email !');
          // it means no username corresponds to this email address
        }

將在 snapshot.forEach() 之前調用整個代碼 in.then() function 將在 promise 完成后執行，所以這部分在這里

if (this.state.find == false) {
              Alert.alert('Le pseudo ne correspond pas à son adresse email !');
              // it means no username corresponds to this email address
            }

將永遠被稱為你應該把它添加到里面而不是這樣

class ModalLogin extends React.Component {
  state = {
  email: '',
  password: '',
  pseudo: '',
  items: [],
  find: '',
  iconEmail: require('../Images/icon-email.png'),
  iconPassword: require('../Images/icon-password.png'),
  iconName: require('../Images/name.png'),
  isSuccessful: false,
  isLoading: false,
  scale: new Animated.Value(1),
  translateY: new Animated.Value(0),
  top: new Animated.Value(screenHeight),
  };

  handleLogin = () => {
  const email = this.state.email;
  const password = this.state.password;
  const pseudo = this.state.pseudo;

  if ((pseudo != '') & (email != '') & (password != '')) {
    let user_pseudo = firebase.database().ref('/users');

    user_pseudo.once('value').then(snapshot => {
      let find = false;
      snapshot.forEach(el => {
        if (
          pseudo === el.val().username &&
          email.toLowerCase() === el.val().email
        ) {
          find = true;
          this.setState({find: true}, () => {
            this.setState({isLoading: true});
            firebase
              .auth()
              .signInWithEmailAndPassword(email, password)
              .catch(error => {
                if (error.code === 'auth/user-not-found') {
                  this.handleSingin().bind(this);
                } else Alert.alert('Error', error.message);
              })
              .then(response => {
                this.setState({isLoading: false});

                if (response) {
                  // Successful
                  this.setState({
                    isSuccessful: true,
                  });
                  //storage

                  this.storeName(this.state.user);
                  //this.fetchUser();
                  this.props.updateName(this.state.user);

                  setTimeout(() => {
                    Keyboard.dismiss();
                    this.props.closeLogin();
                    this.setState({
                      isSuccessful: false,
                    });
                  }, 1000);
                }
              });
            this.setState({isLoading: false});
          });

        }

      });
      if (find == false) {
        Alert.alert('Le pseudo ne correspond pas à son adresse email !');
        // it means no username corresponds to this email address
      }
    });

  } else {
    console.log('erreur null');
    Alert.alert(
      'Error',
      "login/password don't match!",
    );
   }
  };

ps：我建議你多研究 javascript 並搜索有關承諾