使用redux全局反应原生传递状态

在我的应用程序中,LoginScreen(fristScreen)可以使用facebook登录,当用户成功登录时,应用程序会收到一个Facebook access token并导航到下一个屏幕(VerifyScreen).在VerifyScreen(secondScreen)中,当我单击一个按钮时,我想facebookToken在屏幕上显示全局状态并显示.以下是我的代码:

App.js

import { createStore } from 'redux'
import { Provider } from 'react-redux'
import { createDrawerNavigator, createStackNavigator, } from 'react-navigation'

const reducer = (state = '', action) => {
  switch (action.type) {
    case 'UPDATE':
            return { facebookToken: action.payload}
  }
    return state
}

const store = createStore(reducer)

class App extends Component {
  render(){
    return(

      
        
          
        
       
    )
  }
}

LoginScreen.js

import { LoginButton, AccessToken } from 'react-native-fbsdk';
import {connect} from 'react-redux'

class LoginScreen extends Component{

  
             {
                  if (error) {
                    console.log("login has error: " + result.error);
                  } else if (result.isCancelled) {
                    console.log("login is cancelled.");
                  } else {
                    this.props.navigation.navigate('VerifyScreen')
                    AccessToken.getCurrentAccessToken().then(
                      (data) => {
                        this.setState({facebookToken:data.accessToken},
                    () =>  console.log('facebookToken.state',this.state.facebookToken),
//Here I am getting undefined for 'this.props.facebookToken'                        
() =>  console.log('facebookToken.props',this.props.facebookToken),
                        console.log('facebook login success!'),
                        console.log('facebook token is:',data.accessToken.toString()))
                      }
                    )
                  }
                }
              }
              OnLogoutFinished={() => console.log("logout.")}/>

//I created a button to see if I could call global state. but this would give me an error "state is not defined"
 this.props.increaseCounter()}/>




function mapStateToProps(state) {
    return {
        facebookToken: state.facebookToken
    }
}

function mapDispatchToProps(dispatch) {
    return {
        increaseCounter: () => dispatch({ type: 'UPDATE',payload: state.facebookToken }),
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(LoginScreen)

VerifyScreen.js

import React, { Component } from "react";
import {
    View,
    Text,
    StyleSheet,
    Button
} from "react-native";
import {connect} from 'react-redux'


class VerifyScreen extends Component {
    render() {
        return (
        
            
                   //I get undefined data when I console.log
         console.log(this.state.facebookToken,'this.state.facebookToken')}/>
          {this.props.facebookToken}
        
        );
    }
}

function mapStateToProps(state) {
    return {
        facebookToken: state.facebookToken
    }
}

export default connect(mapStateToProps, null)(VerifyScreen)

const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center'
    }
});

在我的LoginScreen中,当我在console.log中this.state.facbookToken获取数据时,但当我导航到nextScreen(VerifyScreen)和console.log时,我得到了undefined.

我的问题:如何从VerifyScreen调用全局状态？我对redux很新,所以我可能做错了.任何建议或意见都会有所帮助.提前致谢!