我有一个离子静态列表,我只需要列表部分可滚动 . 我已经尝试了这个stack overflow question's answer但它对我不起作用 .
它说 - If we have ion-item tag in our code, it could cause some issue for us. So make sure to remove this tag . 我不知道是不是因为这个原因 . 无论我做什么,我只能让整个内容可滚动或根本不滚动 . 我只希望下面提到的列表部分可滚动 .
这是我的代码:
<ion-content class="calendar-page ">
<div class="calendar-section" padding>
<ion-calendar #calendar></ion-calendar>
</div>
<div class="reminder-section ">
<div class="bar bar-header bar-assertive section-title mt-20">
<h2 class="title" align="center">Reminders</h2>
</div>
**//scrollable from here**
<ion-list>
<ion-item class="custom-font-size">
QUIT SMOKING<span item-end>Today, 14:00</span>
<ion-icon name="alarm" class="alarm-icon-color" item-end></ion-icon>
</ion-item>
<ion-item class="custom-font-size">
GET FIT<span item-end>Today, 18:00</span>
<ion-icon name="alarm" class="alarm-icon-color" item-end></ion-icon>
</ion-item>
<ion-item class="custom-font-size">
QUIT SMOKING<span item-end>11 MAY 2018, 08:00</span>
<ion-icon name="alarm" class="alarm-icon-color" item-end></ion-icon>
</ion-item>
<ion-item class="custom-font-size">
QUIT SMOKING<span item-end>10 MAY 2018, 11:00</span>
<ion-icon name="alarm" class="alarm-icon-color" item-end></ion-icon>
</ion-item>
<ion-item class="custom-font-size">
GET FIT<span item-end>8 MAY 2018, 10:12</span>
<ion-icon name="alarm" class="alarm-icon-color" item-end></ion-icon>
</ion-item>
</ion-list>
**// scrollable till here**
</div>
</ion-content>
我正在使用离子3 .
2 回答
https://codepen.io/KevinWang15/pen/QNJEXX
这是@NRaghavendra建议的最佳解决方案