1. npm install swiper
2.html中
<swiper class="unityIframe" :slidesPerView="1" :spaceBetween="30" :loop="true" :pagination="{ clickable: true}" :autoplay="{ delay: 15000, disableOnInteraction: false}" :modules="modules" @swiper="onSwiper" @slideChange="onSlideChange" > <swiper-slide class="unityIframe" v-for="(item,index) in floorList" :key="index"> <p>{{item.names}}</p> <img :src="item.url" alt=""> </swiper-slide> </swiper>
3.引入
import { Swiper, SwiperSlide } from 'swiper/vue/swiper-vue' import { Autoplay, Navigation, Pagination, A11y, } from 'swiper'// 分页器 import 'swiper/swiper.min.css'; import 'swiper/modules/pagination/pagination.min.css'; const modules = [Autoplay, Pagination, Navigation, A11y];