如何强制vue轮播每页显示一个

Question

我安装了 vue-carousel 并进行了设置，它在我的页面上工作，但滑块似乎每页显示三个这些是我传递给组件的内容<carousel        :id="id"        :navigationEnabled="true"        :paginationEnabled="true"        :slidesPerPage="slidesPerPage"        :perPage="1"        :loop="loop == 'true' ? true : false"        :autoplay="autoplay == 'true' ? true : false"        :autoplayTimeout="timeout ? parseInt(timeout) : 2000"        :autoplayDirection="sliderDirection ? sliderDirection : 'forward'"        ></carousel>我怎样才能让它在页面中只显示一个....？

Answer 1

您可以将这些属性设置为轮播，如下所示： :perPageCustom="[[0, 1], [768, 2], [1024,3]]" 这意味着在移动设备上它将显示 1 张图像，在平板电脑上显示 2 张图像和桌面 3 图像。您可以通过更改这些数字来调整视口和要显示的图像数量。您也可以将其设置为 :perPage="1" ，无论视口大小如何，它都将始终显示 1 张图像。您可以在https://www.npmjs.com/package/vue-carousel查看所有轮播的可用属性。为什么要设置属性：slidePerPage？