本文介紹了關于新版 vue-awesome-swiper，分享給大家，具體如下：
問題
使用
引入（前面的步驟和往常一樣）
npm install vue-awesome-swiper --save
在 main,js 里引入（全局）:
import VueAwesomeSwiper from 'vue-awesome-swiper' Vue.use(VueAwesomeSwiper) import 'swiper/dist/css/swiper.css'
(css 不顯示的問題可能就在這)
組件里引入：
import 'swiper/dist/css/swiper.css' //在全局沒引入，這里記得要！import { swiper, swiperSlide } from 'vue-awesome-swiper'export default { components: { swiper, swiperSlide }}配置
template：
<swiper :options="swiperOption"><swiper-slide>I'm Slide 1</swiper-slide><swiper-slide>I'm Slide 2</swiper-slide><swiper-slide>I'm Slide 3</swiper-slide><div class="swiper-pagination" slot="pagination"></div> </swiper>
script：
export default {data() { return { swiperOption: { // 所有的參數同 swiper 官方 api 參數一樣 // } }},... }重點在于 swiperOption 里面的變化，區別看下圖：
原來 pagination 和 autoplay 要這樣配置！
我原來就是在這兩處錯了，導致 pagination 不顯示，圖片不輪播。
出錯前：
糾正后：
總結
vue-awesome-swiper官網其實早放出說明來了，但自己一看全是英文，就沒想看下去。后來發其實很容易看懂得，吸取教訓自己多去看看文檔，不要找 demo 去抄。
還是少依靠插件，有些插件隨時更新，等有能力，自己造！
弄到晚上12點，才弄明白原來 Swiper 版本區分了組件和普通版本，不能看照原來的經驗寫了。
發現網上關于最新 vue-awesome-swiper就兩三篇，而且沒說清楚。于是寫下這篇，希望對大家有幫助，也希望大家多多支持武林網
新聞熱點
疑難解答
