【问题标题】:How to set the size for each ion-popover如何设置每个 ion-popover 的大小
【发布时间】:2020-09-16 11:52:54
【问题描述】:

我有不止一个 ion-popover。我想为每个人设置大小。我研究了这个问题,我尝试了所有方法,但我做不到。但是,我成功地在 variables.scss 中全局更改了大小,但不是单独更改。有谁知道如何设置每个 ion-popover? P.s 我正在使用 ionic 5 和 angular

这只是我能做的,在全球范围内改变。 这是我在 variables.scss

中添加的
    ion-popover {
  .popover-wrapper {
   .popover-content {
     width: fit-content;
   }
  }
}

【问题讨论】:

    标签: angular ionic-framework popover ionic5


    【解决方案1】:

    ion-popover 有一个名为cssClass 的属性。您可以为每个类分配唯一的类,然后从here 提到的任何位置定位它。

     async presentPopover(ev: any) {
        const popover = await this.popoverController.create({
          component: PopoverComponent,
          cssClass: 'my-custom-class',
          event: ev,
          translucent: true
        });
        return await popover.present();
      }
    

    现在您可以执行以下操作(通知&.my-custom-class):

    ion-popover {
    &.my-custom-class {
      .popover-wrapper {
       .popover-content {
         width: fit-content;
       }
      }
    }
    }
    

    【讨论】:

    • 对于现在正在努力设置这些弹出框的人。您必须为每个弹出窗口定义一个像上面一样的 scss 类,然后将每个 scss 类放在 variables.scss
    • 您可以在服务中创建一个辅助函数,并使用唯一名称或类作为参数调用该函数
    猜你喜欢
    • 1970-01-01
    • 2020-11-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-02
    • 1970-01-01
    • 2014-01-10
    相关资源
    最近更新 更多