1. tab+NavController
使用tab組件,執(zhí)行頁面跳轉(zhuǎn)后,新頁面仍然會包含tab,很多時候我們希望退出tab到新的頁面。這里我們不能直接使用
this.navCtrl.push(SomePage);
而要用
this.app.getRootNav().push(SomePage);
2. 刪除歷史記錄
比如我們完成登錄以后進入首頁,用戶操作后退按鈕時,我們不希望還能回溯到登錄頁,這時候需要刪除登錄頁的歷史記錄。這時,我們只需要添加以下代碼:
//前往首頁
this.navCtrl.push(HomePage, {
})
.then(() => {
const startIndex = this.navCtrl.getActive().index - 1;
console.log(startIndex)
this.navCtrl.remove(startIndex, 1);
});
3. 跨頁面數(shù)據(jù)通信
主要使用事件機制。比如假設(shè)接口返回登錄態(tài)失效,我們需要跳轉(zhuǎn)到登錄頁。但由于已經(jīng)把http相關(guān)功能抽象到專門的網(wǎng)絡(luò)接口處理模塊了,而作為一個Injectable模塊不能直接處理NavController的跳轉(zhuǎn),否則會報錯,這主要是為了保證數(shù)據(jù)層和具體處理邏輯的分離。這時候我們使用事件的方式來進行通知:
import { Events } from 'ionic-angular';
@Injectable()
export class HttpService {
...
private event: Event,
...
}
this.events.publish('token:expired', Date.now());
然后在具體的業(yè)務(wù)頁面接收事件并作出相應(yīng)處理:
constructor(public navCtrl: NavController,
public events: Events,
public app: App,
public navParams: NavParams) {
events.subscribe('token:expired', (timestamp)=>{
this.navCtrl.push(LoginPage);
})
}
值得注意的是,這里不需要在每個頁面添加這個邏輯,否則會跳轉(zhuǎn)多次,也就是說事件會向所有頁面廣播。