typescript 基于Ionic 4标签的应用程序中的多个侧菜单

ut6juiuv  于 2023-06-24  发布在  TypeScript
关注(0)|答案(1)|浏览(157)

我用命令创建了一个基于标签的应用程序。

ionic start myApp tabs

我们的想法是为每个标签页添加不同的侧菜单,尝试做一个主详细导航,使用侧菜单作为主元素列表和标签页显示详细内容。
app.component.html文件如下所示:

<ion-app>
  <ion-router-outlet></ion-router-outlet>
</ion-app>

tab1.page.html类似代码:

<ion-menu contentId="aside1" side="start">
    <ion-content>
        <ion-list>
            <ion-item class="side-menu-item" *ngFor="let item of strings">{{item.title}}</ion-item>
        </ion-list>
    </ion-content>
</ion-menu>
<ion-router-outlet id="aside1" main></ion-router-outlet>

tab2.page.html代码:

<ion-menu contentId="aside2" side="start">
    <ion-content>
        <ion-list>
            <ion-item class="side-menu-item" *ngFor="let item of strings">{{item.title}}</ion-item>
        </ion-list>
    </ion-content>
</ion-menu>
<ion-router-outlet id="aside2" main></ion-router-outlet>

当我在第一次浏览标签时滑动并显示单个字符串数组元素时,aside1aside2菜单都可以工作。问题是当我回到上一个标签,而不是再次显示aside1 side menu,这个停止工作和什么swipe手势真正做的是显示另一个标签的侧菜单。
我不知道是否需要tab1.page.tstab2.page.ts中的特定代码才能使其工作。

yrefmtwq

yrefmtwq1#

问题是我没有在每个侧菜单中指定menuId。例如:

<ion-menu contentId="main-content" menuId="main"> ... </ion-menu>

<ion-menu menuId="bar-menu"> ... </ion-menu>

我不删除的情况下,有人觉得有趣的问题,为每个页面创建不同的菜单

相关问题