使用登录按钮时，如何使用react-native-fbsdk自定义登录后的登录页面？

Question

使用this react-native wrapper，我使用登录按钮+访问令牌在文档中实现了登录解决方案。

const FBSDK = require('react-native-fbsdk');
const {
  LoginButton,
  AccessToken
} = FBSDK;

var Login = React.createClass({
  render: function() {
    return (
      <View>
        <LoginButton
          publishPermissions={["publish_actions"]}
          onLoginFinished={
            (error, result) => {
              if (error) {
                alert("login has error: " + result.error);
              } else if (result.isCancelled) {
                alert("login is cancelled.");
              } else {
                AccessToken.getCurrentAccessToken().then(
                  (data) => {
                    alert(data.accessToken.toString())
                  }
                )
              }
            }
          }
          onLogoutFinished={() => alert("logout.")}/>
      </View>
    );
  }
});

结果是一个带有 fb 登录按钮的屏幕，登录时导航到带有注销的页面 button.First 如果我没有为 it.Plus 编写代码，这个注销按钮来自哪里我不知道不需要注销按钮。而不是想显示我的应用程序的主页？我哪里错了？

Answer 1

如果您想在登录后显示主页（并且大概只在您未登录时显示登录页面），您必须自己在您所在的州（或商店）跟踪登录状态。

简单示例：

var Login = React.createClass({

  getInitialState() {
    return {isLoggedIn: false}
  },

  render: function() {

    if (this.state.isLoggedIn) {
      return (
        <Text> I'm Logged In! </Text>
      )
    } else {
      return (
        <View>
          <LoginButton
            publishPermissions={["publish_actions"]}
            onLoginFinished={
              (error, result) => {
                if (error) {
                  alert("login has error: " + result.error);
                } else if (result.isCancelled) {
                  alert("login is cancelled.");
                } else {
                  AccessToken.getCurrentAccessToken().then(
                    (data) => {
                      this.setState({isLoggedIn: true})
                      alert(data.accessToken.toString())
                    }
                  )
                }
              }
            }
            onLogoutFinished={() => alert("logout.")}/>
        </View>
      );
    }        
  }
});

对于更复杂（和真实）的功能，您可能需要使用 Navigator

使用登录按钮时，如何使用react-native-fbsdk自定义登录后的登录页面？

While using login button, how to customise the landing page after login using react-native-fbsdk?

react-native

react-native-fbsdk