需要实现的效果:一次显示5个slide,滚动也是一次滚动5个
我们可以看到官网展示的api上没有写此功能,百度也多为直接改css
仔细阅读查找文档后发现官方有给留后路
====》
可以看到官方给留的后路还挺多的,只是没展示在文档上,在这些api中通过名字及尝试,最终锁定这俩
slidesToScroll // 一页滚动几个
slidesToShow //一页展示几个所需传的值都是Number
<a-carousel
arrows
:dots="false"
:slides-to-show="5" //一页展示5个
:slides-to-scroll="5"// 一页滚动5个
>
<div
slot="prevArrow"
class="custom-slick-arrow"
style="left: -20px;zIndex: 1"
>
<a-icon type="left" />
</div>
<div
slot="nextArrow"
class="custom-slick-arrow"
style="right: -20px"
>
<a-icon type="right" />
</div>
<div v-for="(o, index) in 10" :key="index" class="musicBox">
<h1>{{ index }}</h1>
</div>
</a-carousel>