关于vue.js:vueawesomeswiper使用

vue-awesome-swiper

我喜爱的一款轮播插件，他有多个抉择！而且反对手持滑动
所以我用到了明天。

装置

自己阐明一点：为什么不必4.1.1
答：vue-awesome-swiper v4.1.1版 autoplay、effect等有效问题至今未解决

cnpm i vue-awesome-swiper@3.1.3 -S

引入

全局引入

import VueAwesomeSwiper from 'vue-awesome-swiper' import 'swiper/dist/css/swiper.css' Vue.use(VueAwesomeSwiper)     

独自引入

import Vue from 'vue'import { swiper, swiperSlide } from 'vue-awesome-swiper'import "swiper/dist/css/swiper.css"//或者require('swiper/dist/css/swiper.css')

测试

<template>  <swiper class="swiper">    <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-slide>Slide 10</swiper-slide>  </swiper></template>

A组

我最喜爱的轮播这款，在我的MXLOGO保留至今！然而很快辞别了
因为我要更新MXLOGO 8.

        <swiper :options="swiperOption">            <swiper-slide>                <a href="XXXXXX" target="_blank">                      <img src="./assets/1.jpg">                </a>            </swiper-slide>            <swiper-slide>                <a href="XXXXXX" target="_blank">                    <img src="./assets/1.jpg">                </a>            </swiper-slide>            <swiper-slide>                <a href="XXXXXX" target="_blank">                    <img src="./assets/1.jpg">                </a>            </swiper-slide>        </swiper>