Reputation: 201
I have this React Native code and I want to use the gameOfTheUser variable (which is created in the arrow function: userRef. ounce (' value'). then (snapshot =>
) outside this one, in order to be able to continue the different conditions. How to do it? I imagine (and I hope!) that there is a simple solution to this problem.
My 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>;
}
}
My 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 />;
}
}
Upvotes: 1
Views: 770
Reputation: 942
I think i can describe your purpose at:
There are many way to do this but as "simple" in your question, i think React Native Async Storage
is a good solution.
AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
See React Native document about Async Storage here.
There is some demo codes:
Get data from storage:
var gameOfTheUser = AsyncStorage.getItem('gameOfTheUser');
Save data to Async Storage:
await AsyncStorage.setItem('gameOfTheUser', 'the_witcher_3');
Note: Async storage can only save data with type of String. So with complex data like array or Object you must
JSON.stringify
it first
Upvotes: 1