vue中使用swiper的虚拟slide

1. 先安装

   "swiper": "5.4.5",
   "vue-awesome-swiper": "^4.1.1",
   

2. 使用
   这里不能直接在created中直接去修改virtual.slides，要使用swiper实例.virtual.appendSlide，官方api有virtual的所有方法
   

   <template>
     <swiper class="main" :options="swiperOption" ref="main"></swiper>
   </template>
   <script>
   import { Swiper } from 'vue-awesome-swiper';
   import 'swiper/css/swiper.css';
   export default {
     data() {
       return {
         swiperOption: {
           virtual: {
             slides: []
           }
         }
       };
     },
     created() {
       this.mainSwiper.virtual.appendSlide(['1','2','3']);
     },
     computed: {
       mainSwiper() {
         return this.$refs.main.$swiper;
       }
     },
     components: {
       Swiper
     }
   };
   </script>