解決WX-IOS打開公衆號網頁出現的底部導航條

在微信公衆號中，打開跳轉連接時會，瀏覽器底部分出現一個導航條，致使屏幕空間壓縮。網上有些人給出了js，vue的解決方案，那麼我貼一下angular版本的，但願能對你有所幫助。

 

代碼：

export class RouteWithoutHistory extends PathLocationStrategy {
    pushState(state: any, title: string, url: string, queryParams: string): void {}
}

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    ...
  ],
  providers: [
    ...
    { provide: LocationStrategy, useClass: RouteWithoutHistory},
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

　

原理：

    底部的導航條是由於wx瀏覽器產生了歷史記錄致使的，因此咱們操做的時候不產生歷史記錄就行啦。

　最開始，我想到了navigateByUrl中的replaceUrl參數，但這樣作面臨兩個問題：1 改動比較大；2 Ionic的的tab中，沒辦法設置此參數。因此, 要另想它法。

   後面我查到，angular與dom管理history這塊與LocationStrategy有關，自已寫一個也比較麻煩。那就繼承默認的LocationStrategy, 而後重載其pushState方法，讓它再也不往瀏覽器「通風報信」就好啦。

   換作平時，我必定會想了：「我從未聽過如此奇怪的要求」。