vue-awesome-swiper做滑動效果

1.swiper官網

https://www.swiper.com.cn/

里面的在vue里面使用swiper 進入 https://github.com/surmon-china/vue-awesome-swiper

然后  npm install vue-awesome-swiper --save  下載到依賴包

引用（這里是按需引用） 然后定義一下 一頁出現幾個 

<script>
	// 引入vue-awesome-swiper
	import 'swiper/dist/css/swiper.css'
	import { swiper, swiperSlide } from 'vue-awesome-swiper'
	export default {
		data(){
			return{
				swiperOption: {
					// 一頁出現幾個
				          slidesPerView:3,
				        }
			}
		},
	  components: {
	    swiper,
	    swiperSlide  
	  }  
	}
</script>

 模板里

<swiper class='hot-swiper' :options="swiperOption">
		<swiper-slide >
			<div class="hot-swiper-content">
				<img src="./img/1.jpg"  style="width:100px;"> 
				  <div>圖片1</div>
				  <div>10</div>
			</div>
		</swiper-slide> 
<swiper>