反应本机FBSDK onLoginFinished推到新屏幕

问题描述:

我有点新使用反应原生,我试图实现Facebook登录与我的应用程序使用反应原生fbsdk。反应本机FBSDK onLoginFinished推到新屏幕

我已经知道它会向用户的Facebook配置文件请求权限,然后返回到应用并显示成功提醒消息。我不想在登录已完成时显示警报,而是想推入新的屏幕。

这是在主类的构造函数我的登录按钮代码:

constructor(props){ 
super(props); 
this.goToNewPage = this.goToNewPage.bind(this); 
const infoRequest = new GraphRequest(
    '/me', 
    {parameters: { 
      fields: { 
      string: 'email,first_name,last_name,id,gender' // what you want to get 
      } 
    }}, 
    this._responseInfoCallback, 
); 
Login = React.createClass({ 
    render: function() { 
    return (
     <View > 
     <LoginButton 
      navigator={this.props.navigator} 
      style = {{marginLeft:55, marginRight:55, height:50, width:300}} 

      onLoginFinished={ 
      (error, result) => { 
       if (error) { 
       alert("Login failed with error: " + result.error); 
       } else if (result.isCancelled) { 
       alert("Login was cancelled"); 
       } else { 
       alert("Login was successful with permissions: " + result.grantedPermissions) 
       new GraphRequestManager().addRequest(infoRequest).start(); 
       this.goToNewPage; 

       } 
      } 
      } 
      onLogoutFinished={() => alert("User logged out")} 
      /> 
     </View> 
    ); 
    } 
}); 
} //closes constructor 

_responseInfoCallback(error: ?Object, result: ?Object) { 
if (error) { 
    alert('Error fetching data: ' + error.toString()); 
} else { 
    alert('Success fetching data: ' + result.toString()); 
    console.log(result); 
} 
} 

goToNewPage(){ 
console.log("Hello from go to new page function"); 
this.props.navigator.push({ 
    id: 'newPage', 
    name: 'Going To New Page', 
}); 
} 

但都显示成功后的警报,并没有推到了新的一页。似乎this.props.navigator在我的Login类中不被识别,我不知道为什么。任何帮助都将不胜感激

+0

我在你的app上做的和你一样,区别在于我调用另一个绑定到组件的方法。我没有在这里试过,但如果你创建另一个方法并将它绑定到组件,然后调用导航器,它可能会工作。 –

原来的问题是,我在我的构造函数中声明登录类。将它移动到componentWillMount函数为我修复了它!

当前您在调用goButtonWith()方法时出错,LoginButton组件的结果块以及任何类型的块中,我们无法直接访问当前类引用“this”,因为它失去了可达性。

那么你应该创建一个全局变量,这个组件

VAR _this;

和在像部件构造分配类的电流参考:

_this =此;

并且应该使用_this.props.navigator.push代替goToNewpage()方法中的this.props.navigator.push。谢谢!