Ionic 离子菜单不做动画，如何添加动画

fdx2calv 于 2023-05-05 发布在 Ionic

关注(0)|答案(3)|浏览(259)

我在爱奥尼亚文档中看到了它，但我找不到任何关于它的信息。当我单击按钮打开菜单时，它正常打开但没有任何动画，如何在菜单打开和关闭时添加动画？？？

<div class="toatal_pages">
        <ion-menu side="start" menuId="first" contentId="main" >
          <ion-content>
            info
            </ion-content>
        </ion-menu>
        <div class="right> id="main">
        <button (click)="openMenu()"> OPEN MENU</button>
        </div>
      </div>
      
      
        async openMenu() {
          await this.menuController.open();
        }

ionic-framework

来源：https://stackoverflow.com/questions/69859931/ion-menu-is-not-doing-animation-how-to-add-animation

3条答案

按热度按时间

nle07wnf1#

请确保您是从angular import { MenuController } from '@ionic/angular'导入它;

#Try this.

 // template code :
<ion-menu side="start" menuId="first" contentId="main">
  <ion-header>
    <ion-toolbar color="primary">
      <ion-title>Start Menu</ion-title>
    </ion-toolbar>
 </ion-header>
<ion-content>
 <ion-list>
  <ion-item>Menu Item</ion-item>
  <ion-item>Menu Item</ion-item>
  <ion-item>Menu Item</ion-item>
  <ion-item>Menu Item</ion-item>
  <ion-item>Menu Item</ion-item>
</ion-list>

//TypeScript code 
constructor(private menu: MenuController) { }

openMenu() {
    this.menu.enable(true, 'first');
    this.menu.open('first');
}

赞(0）回复(0）举报 2023-05-05

uxh89sit2#

如果您正在谈论默认动画，那么请确保您在应用程序中导入了离子提供的CSS
对于自定义动画，您需要遵循以下来自Ionic的文档

赞(0）回复(0）举报 2023-05-05

8ulbf1ek3#

我有一个模拟的问题...检查您的应用模块，并确保在导入Ionic Module时，animated未设置为false：

imports: [
...
IonicModule.forRoot(animated: true),
...
]

赞(0）回复(0）举报 2023-05-05

我来回答

Ionic 离子菜单不做动画，如何添加动画

3条答案

相关问题

热门标签

最新问答