我可以在上一个屏幕中调用函数-反应本机吗?

问题描述 投票:0回答:1

调用后,我在SignUp屏幕中有一个函数“ signInWithPhoneNumber”,它将我导航到Confirmation屏幕,并且在导航后传递一些参数以确认收到了我的验证码,因此,在“确认”屏幕中,我有一个“重新发送验证码”按钮,因此我的问题是当我按“重新发送”时,我想在“注册”屏幕中调用“ signInWithPhoneNumber”功能以获取新代码

所以你怎么想?有可能吗?

或在确认屏幕中重写signInWithPhoneNumber,然后在按重新发送按钮后调用它?

注册屏幕-功能

  signUp = async () => {

    const {phoneNumber} = this.state;
    this.setState({message: 'Sending code ...'});
    const phoneWithAreaCode = phoneNumber.replace(/^0+/, '+972');
    console.log(phoneWithAreaCode);
    auth()
      .signInWithPhoneNumber(phoneWithAreaCode, true)
      .then(confirmResult => {
        console.log('confirmResult', confirmResult);
        this.setState({confirmResult, message: 'Code has been sent!'});
        // this.createUserDatabase();
      })
      .then(() => {
        this.props.navigation.navigate('Confirmation', {
          message: this.state.message,
          confirmResult: this.state.confirmResult,
          createUser: uid => this.createUserDatabase(uid),
        });
      });
  };

确认画面-功能

confirmCode = codeInput => {

    const confirmResult = this.props.navigation.state.params.confirmResult

    if (confirmResult && codeInput.length) {
      confirmResult
        .confirm(codeInput)
        .then(user => {
          clearInterval(this.interval);
          const {params} = this.props.navigation.state;
          //Check if any users exist
          database()
            .ref(`users`)
            .limitToFirst(1)
            .once('value', snapshot => {
              if (snapshot.exists()) {
                console.log('exists!');
                return true;
              } else {
                params.createUser(user.uid);
                console.log('No user found Hah');
              }
            });
          this.setState({
            timer: 0,
            message: 'Code Confirmed!',
            isValid: true,
          });
        })
        .catch(error => {
          let errorCode = error.code;
          let errorMessage = error.message;
          console.log(errorCode);
          switch (errorCode) {
            case 'auth/invalid-verification-code':
              this.setState({message: 'Code is invalid', codeInput: ''});
              this.refs.codeInputRef2.clear();
              break;
            default:
              alert(`Please, Check your Messages!`);
              break;
          }
          console.log(errorMessage);
        });
    } else {
      console.log('Not here');
    }
  };
javascript react-native react-navigation
1个回答
0
投票
如果使用redux,则可以将Confirmation屏幕连接到商店,并使用道具中的功能。如果不使用redux,则可以将signInWithPhoneNumber发送到Confirmation屏幕,同时从SignUp屏幕导航到它,就像这样

this.props.navigation.navigate('Confirmation', { message: this.state.message, confirmResult: this.state.confirmResult, createUser: uid => this.createUserDatabase(uid), signInWithPhoneNumber: signInWithPhoneNumber // your actual function here }); });

然后此功能将在Confirmation屏幕中作为道具提供,您可以在需要时调用它
© www.soinside.com 2019 - 2024. All rights reserved.