Ionic Routig使用Vanilla JS

如何解决Ionic Routig使用Vanilla JS

我是离子框架的新手，目前停留在需要执行简单导航的项目上。我正在使用Vanilla js在项目中使用ionic。

这是我的HTML代码：

<ion-router>
    <ion-route url="/new-page" component="new-page"></ion-route>
  </ion-router>
  <ion-nav></ion-nav>

   
    <ion-tabs>
        <!-- Tab views -->
        <ion-tab tab="new-page">
            <ion-nav></ion-nav>
        </ion-tab>

      
        <!-- Tab bar -->
        <ion-tab-bar slot="bottom">
          <ion-tab-button tab="new-page" selected=true>
            <ion-icon name="person"></ion-icon>
          </ion-tab-button>
          
        </ion-tab-bar>
      </ion-tabs>

我在一个js文件中有一个自定义html组件，该文件正在此处呈现。但是，我无法将Tab键与该新组件连接。

我无法解决这个问题。我应该如何在两个屏幕之间导航？

解决方法

Ionic具有用于路由的内置功能，建议遵循以下说明以确保项目的完整性。离子角的示例：https://ionicframework.com/docs/angular/navigation
如果您希望使用Vanilla JS实现自定义路由和功能，建议使用Core Cordova库-https://cordova.apache.org/可以轻松地与Boostrap之类的UI库集成。