Как я получаю имя пользователя и фотографию профиля, используя этот код в React Native FaceBook

#reactjs #react-native

#reactjs #react-native

Вопрос:

Как я получаю имя пользователя и фотографию профиля, используя этот код в React Native FaceBook.

Я использовал LoginManager в главном компоненте приложения для аутентификации пользователя.

Компонент:

 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>
    );    
  }    
}
  

Кто-нибудь может помочь мне войти в систему с именем пользователя и фотографией профиля, используя этот фрагмент в FaceBook React Native.

Ответ №1:

наконец-то я использую этот код, и он работает
Я вызываю это в своем App.js класс

 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);
  }
);
  

}