最近在用ionic 2开发一个小型应用,在实现登录功能遇到了问题。我是采用侧栏菜单的形式实现登录的,类似于QQ,将用户中心、设置等放在侧栏菜单里,实现登录前加载登录前的页面,登录后加载登录后的页面:
实现侧栏菜单是在src/app/app.html中
//在src/app/app.html
<ion-menu [content]="userSetting">
<ion-nav [root]="menuPage"></ion-nav>
</ion-menu>
<ion-nav #userSetting [root]="rootPage"></ion-nav>
在login.ts里用navCtrl.push()方法跳转到app.ts里的MyApp
//请大神忽略if 它是个认证,就是登录成功,关掉loading动画,跳转页面,时间是模拟请求加上去的
if(USER != '') {
setTimeout(() =>{
loading.dismiss();
this.navCtrl.push(MyApp);
},5000);
用这个方法,发现能够进入到home页,但是侧栏菜单不起作用了,后来发现侧栏菜单里关联的menuPage是在一开始就加载好的,也就是从子页面push到MyApp并不能刷新侧栏菜单,所以请问大神们,这样有解决办法吗?或者有其他实现跳转侧栏菜单的方法吗?
注:navCtrl.setRoot()方法也是一样的,只是没有返回箭头。
今天试了一天,终于是找到了一个比较不错的解决办法。一开始我想着改变<ion-nav>里的[root]的指向,发现这个绑定只能绑定一次,即如果我把一开始的menuPage绑定在[root]上,登录之后,去改变[root]的指向页面,就会报错。然后去官网查,官网的教程几笔带过,只说了基本用法,可能是忙着ionic3吧。但是发现了一个新的组件,<ion-segment>,也不能说是新的,我之前也有用过,它是实现一个页面内实现类似于JQuery做的新闻导航栏那样的效果,于是:
在对应ts页面里:
这样就实现了我在侧栏菜单的登录比较好的登录跳转方案。ionic的坑踩不完,我也只是初学者,有不妥的地方欢迎指正,或是大家有什么更好的方案欢迎前来讨论。