Ionic滑块:允许卡片不粘

Question

我使用离子滑块显示3张卡片，其中每张卡片占用屏幕宽度的90%左右(以便下一张稍微可见)

这是它的样子

<ion-slides [options]="{ slidesPerView: 'auto'}">
<ion-slide>
test 1
</ion-slide>
<ion-slide>
test 2
</ion-slide>
<ion-slide>
test 3
</ion-slide>
</ion-slides>

问题是，当我开始拖动幻灯片并释放它时，它不会停留在我离开它的地方(例如在幻灯片之间)，而是将焦点移动到占据屏幕大部分的图像上。它很"粘"。

我想实现的是，无论何时我抓住幻灯片，它都保持在释放时的位置，而不是向左或向右移动。

例如，我需要它保持这样，如果用户离开它:想要看

如何做到这一点?

谢谢!

Answer 1

但这就是ion-slides的工作方式，它试图模仿原生PagerView的行为(在android的情况下)。

你想要的是一个简单的水平可滚动区域。你不需要ionic，它可以很容易地实现仅使用web技术(css):

<style>
.slider {
display: -webkit-box;
overflow-x: scroll;
}
.slider .slider-item {
width: 90%;
margin-right: 20px;
}
</style>
<div class="slider">
<div class="slider-item">...</div>
<div class="slider-item">...</div>
<div class="slider-item">...</div>
</div>