Reputation: 105
I am trying to make a a conditional HomeScreen where if the user has a "UserID" saved to the phone, it should take them to the "PlacesScreen", otherwise have it load the "LoginScreen". I'm using StackNavigation with Redux and am about two weeks into learning react-native.
function nav (state = firstState(), action) {
let nextState;
switch (action.type) {
case 'Home':
nextState = AppNavigator.router.getStateForAction(
NavigationActions.navigate({routeName: 'Home'}),
state
);
return nextState;
break;
case NavActionTypes.NAVIGATE_PLACES:
nextState = AppNavigator.router.getStateForAction(
NavigationActions.navigate({ routeName: 'Places' }),
state
);
return nextState;
break;
}
...etc I want to set the initial state in the reducer to be dependent on weather or not an ID is saved on the phone. I'm very new to react-native and coding in general, im 19, so any help would be greatly appreciated! If you need more code to help, please let me know and I'll send the github link. Thank you in advance! Cooper
Upvotes: 2
Views: 271
Reputation: 51
As redux recommends to keep reducers pure, I would leave the navigation logic out of the reducer and put it into the component. Also I would recommend checking the state on the LoginScreen during the component will mount and resetting the navigation state to PlacesScreen if the state contains the UserID.
e.g.
import store from '../storeLocation'
export class LoginScreen extends React.Component {
...
componentWillMount(){
if(store.getState().userID !== "")
this.props.navigation.dispatch(NavigationActions.reset({
index: 0,
actions: [
NavigationActions.navigate({ routeName: 'Places'})
]
}));
}
...
}
Upvotes: 1