在vue里面使用swiper

在vue里面使用swiper基本上是死的，只需要复职黏贴即可下面则是其代码：

<template>
  <swiper ref="mySwiper" :options="swiperOptions">
    <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>
    <div class="swiper-pagination" slot="pagination"></div>
  </swiper>
</template>

这是主体主要是用来放置图片内容的；

下面则是放置在script里面的引入：

import { Swiper, SwiperSlide } from "vue-awesome-swiper";
import "swiper/css/swiper.css";
export default {
  components: { Swiper},
  data() {
    return {
      index: 0,
      info: {},
      swiperOptions: {
        loop: true,
        autoplay: true,
        pagination: {
          el: ".swiper-pagination"
        }
      }
    };
  }};

这样设置出来的swiper是没有高度的需要自己另外设置高度