RN 0.52升级后,react-native-fbsdk导入未定义

时间:2018-03-09 03:39:06

标签: react-native facebook-login react-native-fbsdk

我刚刚将我的RN项目升级到RN 0.52并且react-native fbsdk无法正常工作所以我改变了我的导入结构:

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

 import { LoginManager,
      AccessToken,
      GraphRequest,
      GraphRequestManager } from 'react-native-fbsdk';

完整源代码:

  import React, { Component } from 'react';
    import { View, ActivityIndicator, FlatList, Image, TouchableHighlight, StatusBar, Alert} from 'react-native';
    import styles from './styles';
    import PropTypes from 'prop-types'
    import { connect } from 'react-redux'
    import { Container, Header, Content, Button, Text, Spinner, Title } from 'native-base';
    import { requestBusiness, receiveBusiness, storeLoginScreenId, receiveAwsId } from '../../actions'
    import { withApollo, ApolloClient, graphql } from 'react-apollo';
    import gql from 'graphql-tag';

    var AWS = require('aws-sdk/dist/aws-sdk-react-native');

    import { LoginManager,
      AccessToken,
      GraphRequest,
      GraphRequestManager } from 'react-native-fbsdk';


     class Login extends Component {

        static propTypes = {
        dispatch: PropTypes.func.isRequired,
        isLoggedIn: PropTypes.bool.isRequired,
        isFetching: PropTypes.bool.isRequired,
        client: PropTypes.instanceOf(ApolloClient).isRequired



      }

      _handleFacebookLogin(navigation, dispatch, client, isFetching) {

            //const { navigation } = this.props
        //LoginManager.logOut();
        LoginManager.logInWithReadPermissions(["business_management","pages_show_list"]).then(
          function (result) {
            if (result.isCancelled) {
              Alert.alert(
                'Facebook Permissions issue')
            } else {
              //alert('Login success with permissions: ' + result.grantedPermissions.toString())
                     AccessToken.getCurrentAccessToken().then(
                  (data) => {
                     AWS.config.region = 'us-east-1';
                     AWS.config.credentials = new AWS.CognitoIdentityCredentials({
                    IdentityPoolId: 'xxxxxxxxxxxxxxx',
                    Logins: {
                    'graph.facebook.com': data.accessToken.toString()
                            }
                             }
                             );
                     AWS.config.credentials.clearCachedId();
                  AWS.config.credentials.get(function(err) {
              if (err){  alert("Error" + err);
              console.log(err);
            }
            dispatch(requestBusiness())

            client.query({
              query: gql`query getCurrentUser($Id: String!) {
                User(id: $Id) {
                  id,
                  posts {
                    postId,
                    postText
                  }
                  }

                }
                }`,
              variables: {Id: AWS.config.credentials.identityId},
              fetchPolicy: 'network-only'
            }).then((result) => {
              dispatch(receiveAwsId(AWS.config.credentials.identityId))          
              dispatch(receiveBusiness())
              if(result.data.businessUser != null){
                  navigation.dispatch({ type: 'LOGGEDIN' });
              }
              else {
                navigation.dispatch({ type: 'ONBOARD' });
              }
            }).catch((err) => {
              console.log('catch', err)
            });
            });

                  }
                )
                     //navigation.dispatch({ type: 'LOGIN' });
            }
          },
          function (error) {
            alert('Login fail with error: ' + error)
            console.log(error)
          }
        )
      }

      componentWillReceiveProps(nextProps) {
       /* 
      const { business, navigation, isFetching, dispatch } = this.props
    if(nextProps.isFetching == false && isFetching == true){
      if(nextProps.business == null && business == undefined){
                navigation.dispatch({ type: 'ONBOARD' });


      } else {
                navigation.dispatch({ type: 'LOGIN' });
      }
    }*/
      }


        render() {
            const {navigation, dispatch, isFetching, client} = this.props

            return (

                  <Container style={styles.container}>
               <Text></Text>
           <Title>
              <Title style={styles.title}>App</Title>
              <Title style={styles.secondaryTitle}>Login</Title>
              </Title>
            {isFetching ? <Spinner color='#FFFFFF' /> : 
             <Button  bordered rounded light
              style={styles.loginButton}
              onPress={() => this._handleFacebookLogin(navigation, dispatch, client, isFetching)}>
                <Text>Login With Facebook</Text>
              </Button>}



                  </Container>

                );
        }




     }

     const LoginComponentWithApollo =  withApollo(Login)

     const mapStateToProps = state => {
      const { business } = state
      const {
        businessInfo,
        lastUpdated,
        isFetching

      } = business
      return {
        isLoggedIn : state.isLoggedIn,
        dispatch : state.dispatch,
        businessInfo,
        lastUpdated,
        isFetching
        }
    }


export default connect(mapStateToProps)(LoginComponentWithApollo);

psckage.json:

{
  "name": "MyApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "aws-sdk": "^2.130.0",
    "native-base": "^2.3.9",
    "prop-types": "^15.6.0",
    "react": "^16.2.0",
    "react-apollo": "^1.4.16",
    "react-native": "^0.52.1",
    "react-native-code-push": "^5.1.2-beta",
    "react-native-fbsdk": "^0.7.0",
    "react-native-onesignal": "^3.0.6",
    "react-native-sentry": "^0.26.0",
    "react-native-vector-icons": "^4.4.0",
    "react-navigation": "^1.0.0-beta.13",
    "react-redux": "^5.0.5",
    "redux": "^3.7.2",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.2.0"
  },
  "devDependencies": {
    "babel-jest": "20.0.3",
    "babel-preset-react-native": "2.1.0",
    "jest": "20.0.4",
    "react-test-renderer": "16.0.0-alpha.12"
  },
  "jest": {
    "preset": "react-native"
  },
  "rnpm": {
    "assets": [
      "./assets/fonts/"
    ]
  }
}

^^我收到以下错误:

Cannot read property 'loginWithReadPermissions' of undefined. 

知道可能导致这种情况的原因是什么?当我进入react-native-fbdsk时,我确实看到这些函数是在那里定义的。

0 个答案:

没有答案