如何使单个离子卡项目列表可滚动

Question

我已经搜索了几个小时，找到一种方法来使单个离子卡在具有多个卡的页面上可滚动。似乎不推荐使用ion-scroll元素，并且所有在线教程都无法使用。

        <ion-card style="height:150px;" scroll-y="true"  class="groupList">

                <ion-card-header>
                 <!-- some content -->
                </ion-card-header>
                <ion-card-content>
                 <ion-list *ngFor="let group of myGroups">
                    <ion-item>
                        <!-- <ion-avatar slot="start">
                            <img [src]="group.photoUrl"/>    
                        <!-- </ion-avatar>  -->
                        <ion-label>
                            <h2>{{group.groupName}}</h2>
                        </ion-label>
                      </ion-item>
                 </ion-list>
                </ion-card-content>
        </ion-card>

这只是一个具有最大高度的简单列表...我只想使单张卡可滚动。
谢谢

Answer 1

只需在您的groupList类上使用overflow: scroll：

在您的page.scss文件中：

.groupList {
    overflow: scroll;
}