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

【问题标题】：react-native-router-flux Calling Actions from functionreact-native-router-flux 从函数调用操作
【发布时间】：2017-12-22 23:54:40
【问题描述】：

这是我当前工作的登录页面。一切正常

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;

但是，我想先调用函数来检查用户名和密码。如果正确，我想进入下一个屏幕。我怎样才能做到这一点。就像下面的这段代码。我真正的问题是我无法弄清楚在渲染方法之外调用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;

【问题讨论】：

这可能会回答你的问题：stackoverflow.com/questions/37346979/…

标签： reactjs react-native react-native-router-flux

【解决方案1】：

也许你可以试试这个：

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

让我们尝试使用()

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

【讨论】：

【解决方案2】：

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

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

【讨论】：