在React Native中与此绑定

时间:2018-07-13 02:45:35

标签: javascript reactjs this native

     _onPressButton =(username) =>{
        // alert("bye")
        this.props.navigation.navigator('Loc');
      }

     loginuser = (username, password) =>{

        Parse.User.logIn(username, password, {
        success: (user) =>  {
          // Do stuff after successful login.
            // 
            this._onPressButton(username);
            alert("hello")

        },
        error: (user, error) => {
          // The login failed. Check error to see why.
          alert("Error: " + error.code + " " + error.message);
        }
       });
      }

    render(){
    let { username } = this.state.username;
    return(

        <View style= {styles.container}>
              <TextField
                  inputContainerStyle={{ justifyContent: 'center', marginTop:30,marginLeft:50, marginRight:50, }}
                  inputStyle={{textAlign: 'center',justifyContent: 'center', backgroundColor: 'rgba(255,255,255,0.5)'}}
                  titleTextStyle={{ textAlign: 'center',justifyContent: 'center', }}
                  label='Username'
                  value={this.state.username}
                  onChangeText={ (username) => this.setState({ username}) }
              />

              <TextField
                  inputContainerStyle={{ justifyContent: 'center', marginTop:0,marginLeft:50, marginRight:50, }}
                  inputStyle={{textAlign: 'center',justifyContent: 'center', backgroundColor: 'rgba(255,255,255,0.5)'}}
                  titleTextStyle={{ textAlign: 'center',justifyContent: 'center', }}
                  label='Password'
                  secureTextEntry={true}
                  value={this.state.password}
                  onChangeText={ (password) => this.setState({ password}) }
              />

            <View>
              <TouchableOpacity
                  style={styles.loginScreenButton}
                   // onPress={() => this._onPressButton()}
                   onPress={() => this.loginuser(this.state.username, this.state.password)}
                  underlayColor='#fff'>
               <Text 
               style={styles.loginText}> Login </Text>
              </TouchableOpacity>
            </View>

        </View>
      );
    }
  }
  export default Project = createStackNavigator({
    Login: { screen: Login },
    Loc: { screen: Loc}
});

更新

我可以使用箭头函数'=>'从函数loginuser(用户名,密码)调用_onPressButton(),但是this.props.navigation.navigator('Loc')无法正常工作。 alert(“ bye”)可以,但是this.props.navigation.navigator('Loc');不执行。也许是因为绑定了'this'。有人可以帮我吗?

PS“ Loc”只是另一个类,它呈现当前位置并进行打印。

1 个答案:

答案 0 :(得分:0)

您可以将箭头函数用于类方法和success / error回调,以获取封闭执行上下文的this值。由于您不使用await,因此也可以跳过async关键字。

loginuser = (username, password) => {
  Parse.User.logIn(username, password, {
    success: (user) => {
      // Do stuff after successful login.
      this._secondFunction();
    },
    error: (user, error) => {
      // The login failed. Check error to see why.
      alert("Error: " + error.code + " " + error.message);
    }
  });
};