登录React Native时无法重定向用户

Posted 2021-05-06

这是使用Meteor的登录组件。我不能让成功的用户重定向到另一个屏幕'Home'。错误是：undefined不是对象（评估'_this2.props.navigation.navigate'）。我试图将重定向放入回调函数，但它也是如此。

我刚用完整的组件代码编辑了这篇文章。

    class SignIn extends Component {

    constructor(props){
      super(props);
      this.state={
        email:'',
        password:'',
        error: null,
        loading: false,
      };
    }


    isValid() {
      const { email, password } = this.state;
      let valid = false;

      if (email.length > 0 && password.length > 0) {
        valid = true;
      }

      if (email.length === 0) {
        this.setState({ error: 'You must enter an email address' });
      } else if (password.length === 0) {
        this.setState({ error: 'You must enter a password' });
      }
      return valid;
    }


   onSignIn() {
      const { email, password } = this.state;


       Meteor.loginWithPassword(email, password, (error) => {
          if (error) {
            this.setState({ error: error.reason });
            console.log(error, 'erreur dans le sign in')
          }else{
           this.props.navigation.navigate('Home')//HERE
          }
        });
    }

    onCreateAccount() {
      const { email, password } = this.state;


      if (this.isValid()) {
        Accounts.createUser({ email, password }, (error) => {
          if (error) {
            this.setState({ error: error.reason })
          } else {
            this.setState({email:''})
            // temp hack that you might need to use
          };
        });
       }
      }


render() {
    return (
      <View style={styles.container}>


...email input here

...password input here

        <TouchableOpacity style={styles.button} onPress={this.onSignIn.bind(this)}>
          <Text style={styles.buttonText}>Sign In</Text>
        </TouchableOpacity>

      </View>
    );
  }
}

答案

我曾经遇到过这样一个奇怪的问题

我必须通过函数调用传递导航道具作为要使用的参数。

<MenuItem onPress={() => this.onVehicleCreatePress(this.props.navigation)}>Add New Vehicle</MenuItem>

 onVehicleCreatePress(props) {
    props.navigate('VehicleCreateScreen')
    this.menu.hide();
  }