Question

我正在尝试在成功注册后导航到HomeScreen，但是我没有得到任何适当的解决方案，如果有人可以帮助请这样做。

以下是我的代码，我使用onSignUpPress（）方法登录用户，我的注册成功，所有数据都在firebase中，但是我不知道如何导航到注册上的任何其他页面。我是React native的新手，所以如果有人可以，请帮忙。

export default class SignupForm extends Component {
  static propTypes = {
    isLoading: PropTypes.bool.isRequired,
    onSignupPress: PropTypes.func.isRequired,
    onLoginLinkPress: PropTypes.func.isRequired
  }
  constructor(props){
    super(props);
    this.state = {
      email: '',
      password: '',
      fullName: '',
      user:''
    }
    this.onSignUpPress = this.onSignUpPress.bind(this);
  }



  hideForm = async () => {
    if (this.buttonRef && this.formRef && this.linkRef) {
      await Promise.all([
        this.buttonRef.zoomOut(200),
        this.formRef.fadeOut(300),
        this.linkRef.fadeOut(300)
      ])
    }
  }

  onSignUpPress()
  {
     // this.setState({error:'',loading:true});

      //const{email,password, fullName}= this.state;
      const user = this.state.user;
      const email = this.state.email;
      const password = this.state.password;
      const fullName = this.state.fullName;

      console.log(this.state.email);
      fire.auth().createUserWithEmailAndPassword(email,password)
      .then((user) =>{
        // ToastAndroid.showWithGravity(
        //   'All Your Base Are Belong To Us',
        //   ToastAndroid.SHORT,
        //   ToastAndroid.CENTER
        // );
        this.setState({user:fire.auth().currentUser});
        console.log("Created: " + user);
        console.log("user is id"+ this.state.user.uid);
        fire.database().ref('User/' + this.state.user.uid).set({username: fullName});
      })
      .catch((error)=>{
         // this.setState({error:'Authentication failed'});
         console.log("Auth failed " + error);

      })
  }

  render () {
    const { email, password, fullName } = this.state
    const { isLoading, onLoginLinkPress, onSignupPress } = this.props
    const isValid = email !== '' && password !== '' && fullName !== ''
    return (
      <View style={styles.container}>
        <View style={styles.form} ref={(ref) => this.formRef = ref}>
          <CustomTextInput
            ref={(ref) => this.mobileInputRef = ref}
            placeholder={'Full name'}
            editable={!isLoading}
            returnKeyType={'next'}
            blurOnSubmit={false}
            value={this.state.fullName}
            withRef={true}
            onSubmitEditing={() => this.emailInputRef.focus()}
            onChangeText={(value) => this.setState({ fullName: value })}
            isEnabled={!isLoading}
          />
          <CustomTextInput
            ref={(ref) => this.emailInputRef = ref}
            placeholder={'Email'}
            keyboardType={'email-address'}
            editable={!isLoading}
            returnKeyType={'next'}
            value={this.state.email}
            blurOnSubmit={false}
            withRef={true}
            onSubmitEditing={() => this.passwordInputRef.focus()}
            onChangeText={(value) =>{console.log(value); this.setState({ email: value })}}
            isEnabled={!isLoading}
          />
          <CustomTextInput
            ref={(ref) => this.passwordInputRef = ref}
            placeholder={'Password'}
            value={this.state.password}
            editable={!isLoading}
            returnKeyType={'done'}
            secureTextEntry={true}
            withRef={true}
            onChangeText={(value) => this.setState({ password: value })}
            isEnabled={!isLoading}
          />
        </View>
        <View style={styles.footer}>
          <View ref={(ref) => this.buttonRef = ref} animation={'bounceIn'} duration={600} delay={400}>
            <CustomButton
              onPress={this.onSignUpPress}
              isEnabled={isValid}
              isLoading={isLoading}
              buttonStyle={styles.createAccountButton}
              textStyle={styles.createAccountButtonText}
              text={'Create Account'}
            />
          </View>
          <Text
            ref={(ref) => this.linkRef = ref}
            style={styles.loginLink}
            onPress={onLoginLinkPress}
            animation={'fadeIn'}
            duration={600}
            delay={400}
          >
            {'Already have an account?'}
          </Text>
        </View>
      </View>
    )
  }
}

Answer 1

成功处理后，有两种方法可以浏览屏幕

本地路由器通量

命令：npm install ---保存react-native-router-flux

遵循Navigattion-router-link

在上述过程中，您需要遵循Actions属性以浏览这些屏幕。

反应导航

命令：npm install --save react-navigation

关注链接：navigation

onSignUpPress()   {
       const user = this.state.user;
       const email = this.state.email;
       const password = this.state.password;
       const fullName = this.state.fullName;

       console.log(this.state.email);
       fire.auth().createUserWithEmailAndPassword(email,password)
       .then((user) =>{        
              Actions.successfullComponentnameinnametagofrouterfile();
       })
       .catch((error)=>{
          console.log("Auth failed " + error);

       })   }

请按照以下步骤通知我

如何在React Native中成功的Firebase SignUp上导航到我的HomeScreen？

1 个答案: