我正在使用 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;
希望它有任何意义,我对本机反应还很陌生。