通过 navPush 进入到子页面后,如果刷新页面的话,会出现没有后退按钮,且没有tabs的情况,此时用户可能无法切换到其他页面。
一般情况下是设置页面的 defaultHistory,使其有上级页面,就会显示后退按钮。
在某些情况下,页面的 defaultHistory 无法确定时,我们可以将 ion-navbar 的 back-button 设为始终显示(通过css实现)。
.toolbar {
.back-button {
display: inline-block;
}
}
这时点击返回按钮,ionic会因为没有定义 defaultHistory 而无法返回,并且抛出异常。需要将源码中返回事件进行修改。
源码:https://github.com/ionic-team/ionic/blob/v3/src/components/toolbar/navbar.ts
backButtonClick(ev: UIEvent) {
ev.preventDefault();
ev.stopPropagation();
this.navCtrl && this.navCtrl.pop(null, null);
}
修改判断逻辑为:可以返回时,执行pop返回上一页;无法返回时,执行popToRoot返回根页面。
backButtonClick(ev: UIEvent) {
ev.preventDefault();
ev.stopPropagation();
if (this.navCtrl) {
if (this.navCtrl.canGoBack()) {
this.navCtrl.pop();
}
else {
this.navCtrl.goToRoot({});
}
}
}
如果页面在tab中,则会返回tab对应的根页面。
网友评论