我如何使用此代码在React Native Facebook中获取用户名和个人资料PIC

Question

我如何使用此代码在React Native Facebook中获得用户名和配置文件。

我已经在主应用程序组件中使用了登录器来验证用户。

组件：

export default class App extends Component {
 componentDidMount() {
 LoginManager.logInWithReadPermissions(['public_profile']).then(
      function(result) {    
        if (result.isCancelled) {    
          console.log('Login cancelled');    
        } else {    
          console.log('Login success with permissions: ' +    
              result.grantedPermissions.toString()    
          );    
        }    
      }
    );    
  }

下面的渲染功能将在登录后执行操作

渲染功能：

render() {
return (
  <View style={styles.container}>
    <LoginButton publishPermissions={['publish_actions']}
      onLoginFinished={(error, result) => {
        if (error) {
          console.log('login has error: ' + result.error);
        } else {
          AccessToken.getCurrentAccessToken().then(data => {
            console.log(data.accessToken.toString());
          });
        }
      }}
    />
  </View>
    );    
  }    
}

有人可以帮助我使用此片段在React Native Facebook中登录用户名和个人资料图片。

Answer 1

最后我正在使用此代码，它可以使用 我在我的app.js class

中调用它

componentDidMount() {
  let currentComponent = this;
LoginManager.logInWithReadPermissions(['public_profile']).then(
  function(result) {
    if (result.isCancelled) {
      console.log('Login cancelled');
    } else {
      AccessToken
      .getCurrentAccessToken()
      .then((user) => {
          // alert("Facebook accessToken:n" + user.accessToken + "nnaccessTokenSource: " + user.accessTokenSource + "nnuserID: " + user.userID)
          console.log(user);
          return user
      })
      .then((user) => {
          const responseInfoCallback = (error, result) => {
              if (error) {
                  console.log(error)
                  alert('Error fetching data: ' + error.toString());
              } else {                                        
                console.log(result)
                  // alert('id: ' + result.id + 
                  //       'nnname: ' + result.name + 
                  //       'nnfirst_name: ' + result.first_name + 
                  //       'nnlast_name: ' + result.last_name +
                  //        'nnemail: ' + result.email);
                  // currentComponent.setState({ Username: result.name  , UserId: result.picture.data.url});
                  currentComponent.props.navigation.navigate('App' , { Username: result.name , UserId: result.picture.data.url});                            
                     }
          }
          const infoRequest = new GraphRequest('/me', {
              accessToken: user.accessToken,
              parameters: {
                  fields: {
                      string: 'email,name,first_name,last_name , picture.type(large)'
                  }
              }
          }, responseInfoCallback);
          // Start the graph request.
          new GraphRequestManager()
              .addRequest(infoRequest)
              .start()
      })
    }
  },
  function(error) {
    console.log('Login fail with error: ' + error);
  }
);

}