使变量在函数外部可访问

时间:2018-03-07 20:22:12

标签: javascript android reactjs function react-native

我有这个React Native代码,我想在这个之外使用gameOfTheUser变量(在箭头函数中创建:userRef. ounce (' value'). then (snapshot =>),以便能够继续不同的条件。怎么做?我想(我希望!)这个问题有一个简单的解决方案。

我的RouterScreen.js:

    import React from 'react';
    import { Text } from 'react-native';
    import fb from '../engine/firebaseConfig';

    export default class RouterScreen extends React.Component {
      componentDidMount() {
        const { navigate } = this.props.navigation;
        fb.auth().onAuthStateChanged(user => {
          if (user) {
            var userRef = fb.database().ref('users/' + user.uid);
            userRef.once('value').then(snapshot => {
              var gameOfTheUser = snapshot.child('game').val();
              console.log('0 : ' + gameOfTheUser);
            });
            if (gameOfTheUser !== null) {
              console.log('InGame');
              var gameID = gameOfTheUser;
              console.log('1 : ' + gameOfTheUser);
              console.log('1 : ' + gameID);
              navigate('Game', { user, gameID });
            } else {
              console.log('NotInGame');
              navigate('Choose', { user });
            }
          } else {
            navigate('Auth');
          }
        });
      }

      render() {
        return <Text>Hello</Text>;
      }
    }

我的App.js:

import React from 'react';
import { StackNavigator } from 'react-navigation';

// Pages
import RouterScreen from './screens/RouterScreen';
import AuthScreen from './screens/AuthScreen';
import ChooseScreen from './screens/ChooseScreen';
import GameScreen from './screens/GameScreen';

export const RootStack = StackNavigator(
  {
    Router: {
      screen: RouterScreen,
    },
    Auth: {
      screen: AuthScreen,
    },
    Choose: {
      screen: ChooseScreen,
    },
    Game: {
      screen: GameScreen,
    },
  },
  {
    initialRouteName: 'Router',
    headerMode: 'none',
  }
);

export default class App extends React.Component {
  render() {
    return <RootStack />;
  }
}

1 个答案:

答案 0 :(得分:1)

我想我可以在:

描述你的目的
  • 登录用户
  • 如果是游戏 - >导航到游戏
  • 其他 - &gt;导航到Auth。

有很多方法可以做到这一点,但在你的问题中“简单”,我认为React Native Async Storage是一个很好的解决方案。

  

AsyncStorage是一个简单,未加密,异步,持久的键值存储系统,对应用程序来说是全局的。它应该用来代替LocalStorage。

请参阅有关异步存储的{React Native文档here

有一些演示代码:

从存储中获取数据:

var gameOfTheUser = AsyncStorage.getItem('gameOfTheUser');

将数据保存到异步存储:

await AsyncStorage.setItem('gameOfTheUser', 'the_witcher_3');
  

注意:异步存储只能使用String类型保存数据。因此,对于像数组或对象这样的复杂数据,您必须首先JSON.stringify