我正在尝试有条件地设置基于redux状态的导航链接,该状态最初未定义但在API调用后异步设置,但是,导航链接在api响应之前呈现一次,因此总是未定义。我正在寻找一些关于如何使用react-native和redux成功完成此操作的建议。
路线配置是 -
export default createBottomTabNavigator(
{
Home: HomeStack,
Search: SearchStack,
...!store.getState().UserReducer.user_id ? { Login: LoginStack } : { }
}
);
父组件是 -
export default class App extends Component
{
constructor(props)
{
super(props);
this.state = {
isLoggedIn: false,
}
}
componentWillMount()
{
fetch(ApiConfig.user.is_logged_in())
.then(response => response.json())
.then(({data}) => {
if (data.status === false)
return;
// Set user information.
store.dispatch(setUserId(data.session.user_id));
store.dispatch(setUserName(data.session.username));
store.dispatch(setUserEmail(data.session.email));
store.dispatch(setUserLastLogin(data.session.old_last_login));
store.dispatch(setUserLastIp(data.session.last_ip));
store.dispatch(setShowCost(data.session.show_cost));
store.dispatch(setShowPrice(data.session.show_price));
store.dispatch(setAvatar(data.session.avatar));
this.setState({ isLoggedIn: true });
})
.catch(error => console.error(error));
}
render()
{
return (
<Provider store={store}>
<NavigationStack loggedIn={this.state.isLoggedIn} />
</Provider>
);
}
}