Ion-select在Ionic 3中不滚动

t2a7ltrp  于 2023-02-20  发布在  Ionic
关注(0)|答案(2)|浏览(149)

这个select包含了register表单中所有国家的列表。关键是表单页面中的ion-content是可滚动的,但是select it self是不可滚动的。下面是代码:

<ion-item>
       <ion-select interface="action-sheet" class="select" placeholder="Country">
          <ion-option ngDefaultControl [value]='country.name' *ngFor="let country of countries">{{country.name}}
          </ion-option>
        </ion-select>
       </ion-item>

为什么选择滚动不起作用?

zzwlnbp8

zzwlnbp81#

这是一个已知问题,您可以在www.example.com上跟踪https://github.com/ionic-team/ionic/issues/17311#issuecomment-460829890
Ionic通过在global.scss中设置以下css提供了一个变通方案

.action-sheet-group {
    overflow: auto !important;
}

希望能有所帮助

8hhllhi2

8hhllhi22#

我在使用interface=popover时遇到了这个问题,解决方法是创建一个全局CSS类:

.my-select-scrollable .popover-viewport {
  overflow: scroll;
}

然后将此属性添加到离子选择

[interfaceOptions]="{cssClass: 'm-select-scrollable'}"

您也许可以执行类似的操作

相关问题