react-native-router-flux从函数调用操作

Question

这是我当前正在工作的登录页面。一切都很好

import React, { Component } from 'react';
import {AlertIOS , StyleSheet , View , Text} from 'react-native';
import Button from 'react-native-button';
import {Actions } from 'react-native-router-flux';

class Login extends Component {
    render() {
        return (
           <View>
               <Text>Hello world this is login page</Text>
               <Button onPress={Actions.login2}>Click </Button>
           </View>
        );
    }
}

export default Login;

但是，我想先调用函数来检查用户名和password.If是否正确，我想转到下一个屏幕。我如何才能做到这一点。就像下面的代码一样。我真正的问题是我不能理解在render方法之外调用Actions.ROUTE_NAME方法。

//This is not working
import React, { Component } from 'react';
import {AlertIOS , StyleSheet , View , Text} from 'react-native';
import Button from 'react-native-button';
import {Actions } from 'react-native-router-flux';

class Login extends Component {
controlMethod(){
if(true){Actions.login2}
}
    render() {
        return (
           <View>
               <Text>Hello world this is login page</Text>
               <Button onPress={this.controlMethod}>Click </Button>
           </View>
        );
    }
}

export default Login;

Answer 1

也许你可以试试这个：

controlMethod(){
  if(true){ Actions.login2() }
}

让我们尝试使用()

希望它能解决你的问题:)

Answer 2

Rizal是对的，在您的第二个示例中，您将controlMethod函数传递给了onPress prop，当您单击<Button>组件时，controlMethod将被执行，但是在您的第二个示例中，controlMethod实际上不会执行Actions.login2函数，而是返回function expression，所以为了使其正常工作，您希望实际调用Actions.login2，这就是为什么您需要在Actions.login2之后添加另一对括号，就像Rizal的示例所示。

此外，请确保将controlMethod绑定到构造函数中，或者可以将其设置为静态方法。