ion-menu 不做动画，怎么添加动画答案

【问题标题】：ion-menu is not doing animation, how to add animationion-menu 不做动画，怎么添加动画
【发布时间】：2021-12-19 21:40:56
【问题描述】：

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

      <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();
        }

【问题讨论】：

标签： javascript angular ionic-framework

【解决方案1】：

请确保您是从 Angular 导入的从“@ionic/angular”导入 { MenuController }；

#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');
}

【讨论】：

其中没有任何内置动画方法。它的默认动画是自动实现的。

【解决方案2】：

如果您谈论的是默认动画，请确保您已将 ionic 提供的 CSS 导入应用程序中

对于自定义动画，您需要遵循 Ionic 的以下Documentation

【讨论】：