<template>

<swiper :spaceBetween="30" :centeredSlides="true" :autoplay='{

? "delay": 2500,

? "disableOnInteraction": false

}' :pagination='{

? "clickable": true

}' :navigation="true" class="mySwiper">

? <swiper-slide>Slide 1</swiper-slide><swiper-slide>Slide 2</swiper-slide><swiper-slide>Slide 3</swiper-slide><swiper-slide>Slide 4</swiper-slide><swiper-slide>Slide 5</swiper-slide><swiper-slide>Slide 6</swiper-slide><swiper-slide>Slide 7</swiper-slide><swiper-slide>Slide 8</swiper-slide><swiper-slide>Slide 9</swiper-slide>

? </swiper>

</template>

<script>

// Import Swiper Vue.js components

import { Swiper, SwiperSlide } from 'swiper/vue';

// Import Swiper styles

import 'swiper/css';

import "swiper/css/pagination"

import "swiper/css/navigation"

import './style.css';

// import Swiper core and required modules

import SwiperCore, {

? Autoplay,Pagination,Navigation

} from 'swiper';

// install Swiper modules

SwiperCore.use([Autoplay,Pagination,Navigation]);

export default {

? components: {

? ? Swiper,

? ? SwiperSlide,

? },

? data() {

? ? return {

? ? };

? },

? methods: {

? }

}

</script>

轉(zhuǎn)自swiper官方文檔