componentWillMount() {
var user = UserService.findAll();
if (user.length > 0) Actions.home();
}
在我的Scene
,'home'是router.js
的关键。
另一方面
onButtonPress() {
var user = UserService.findAll();
if (user.length > 0) Actions.home();
}
像魅力一样工作!
我的router.js
const RouterComponent = () => {
return (
<Router showNavigationBar={false}>
<Stack key="root">
<Scene key="auth" hideNavBar={true}>
<Scene key="login" component={Login} />
</Scene>
<Scene key="home" component={Home} hideNavBar={true}/>
<Scene key="pdf" component={Pdf} hideNavBar={true} />
</Stack>
</Router>
);
};
export default RouterComponent;
on
道具为我做了伎俩
我需要条件导航,所以我使用success
和failure
属性与场景的名称进行导航
我在下面发布我的代码,希望它可以帮助某人
<Scene
key="login"
component={Login}
on={() => UserService.findAll().length > 0}
success={()=>
Actions.replace("home")
}
failure="login"
/>
好的,我可以假设您正在尝试在UserService中获取或检查本地存储以获取用户数据。我建议不要尝试使用生命周期钩componentWillMount
来停止渲染或“装载”组件。相反,当ActivityIndicator
找到用户(由状态控制)时,您可以渲染UserService.findAll()
,因为您不希望在UserService完成用户查找过程之前渲染组件。
类似的东西
在构造函数中指定一个值,该值将用于渲染ActivityIndicator
或组件(我假设login
组件)。我们称之为searching
为例:
// in your constructor
this.state = {
searching : true;
}
// assuming it is an async function
async componentWillMount(){
var user = await UserService.findAll();
if (user.length > 0) {
Actions.home({type : ActionConst.REPLACE}); // no need to update the state here as we will navigate to another screen resetting the navigation stack
}else {
this.setState({
searching : false
});
}
}
// other methods etc
render(){
return this.state.searching ? <ActivityIndicator /> : <Login />
}
当然这是渲染方法的摘要,但你得到的要点:)