0

我正在使用 facebook 登录制作一个 react 本机 ios 应用程序,现在需要在所有其他屏幕上检索结果数据。

我有树屏:

  • 登录.js
  • Profile.js
  • 主.js

Login 包含 loginButton 女巫的工作原理并在控制台中返回用户 public_profile。

Main 包含一个 stacknavigator 并导入其他屏幕

个人资料是我想打印登录用户名的地方,img 等。

问题是当 onLoginFinished 成功时,它会在结果中返回用户信息,但我如何在其他屏幕上抓取它?

看起来这是我需要的 GraphRequestManager 和 infoRequest,但不知道该怎么做。

主.js

'use-strict';
var React = require('react');
window.React = React;
import {AppRegistry, Text} from 'react-native';
import { StackNavigator } from 'react-navigation';

//login screen
import Login from './Login'

//profile screen
var Profile = require('./Profile.js');

const skatebayApp = StackNavigator({
  Login: {screen: Login},
  Profile: {screen: Profile},
},{
  headerMode: 'screen',
});

AppRegistry.registerComponent('skatebayApp', () => skatebayApp);

登录.js

'use-strict';
import React, { Component } from 'react';
import {
  Text,
  View,
  TouchableHighlight,
  Image,
} from 'react-native';

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

export default class Login extends Component{

  render(){
    return(

    <LoginButton
      onLoginFinished={
        (error, result) => {
          if (error) {
            alert("login has error: " + result.error);
          } else if (result.isCancelled) {
            alert("login is cancelled.");
          } else {

            AccessToken.getCurrentAccessToken().then((data) => {
              let accessToken = data.accessToken

              const responseInfoCallback = (error, result) => {
                if (error) {
                  console.log(error)
                  alert('Error fetching data: ' + error.toString());
                } else {
                  console.log(result)
                }
              }
              const infoRequest = new GraphRequest(
                '/me',
                {
                  accessToken: accessToken,
                    parameters: {
                      fields: {
                      string: 'email,name,first_name,last_name,picture'
                      }
                    }
                },
                responseInfoCallback,
                console.log(result)
              );
              new GraphRequestManager().addRequest(infoRequest).start()
            })
          }
        }
      } onLogoutFinished={() => console.log('signed out')}/>
  );
 }
}

Profile.js - 这是我想获取用户信息并打印出来的地方

'use-strict';
import React, { Component } from 'react';
import {
  AppRegistry,
  Text,
  View,
  Image,
} from 'react-native';
import { StackNavigator } from 'react-navigation';


class Profile extends React.Component {

   render() {
   return (
      <View>
        <Text>Username & other info here</Text>
      </View>
   );
  }
}
module.exports = Profile;

希望它有任何意义,我对本机反应还很陌生。

4

1 回答 1

0

将用户详细信息存储在异步存储中,之后您可以从任何屏幕访问它。您可以在此处找到更多详细信息https://facebook.github.io/react-native/docs/asyncstorage.html

于 2017-05-10T10:21:42.887 回答