在vue引入swiper

meixing

如何在vue项目里使用swiper4？

在app.vue

import Swiper from'../static/js/swiper-4.1.0.min.js'
let swiperMain
let Swiper1
let Swiper2

export default {
  name: 'App',
  data(){
    return{
        mainSwiper:[
          {imgURL:'static/images/ad_1.png'},
          {imgURL:'static/images/ad_1.png'},
          {imgURL:'static/images/ad_1.png'},
          {imgURL:'static/images/ad_1.png'},
          {imgURL:'static/images/ad_1.png'},
          {imgURL:'static/images/ad_1.png'},
        ]
    }
  },

  mounted () {
    this.$nextTick(function () {  
      this.lunbo();
    })
  },

  methods: {
    unbo: function() {
      swiperMain = new Swiper('.swiper_main', {
        pagination: {
            el: '.swiper-pagination',
          },
        loop:true,
        autoplay: {
          delay: 4000,
          disableOnInteraction: false,
        },
        speed:200,
      })
      Swiper1 = new Swiper('#brand_swiper_1',{
        loop:true,
        autoplay: {
          delay: 4000,
          disableOnInteraction: false,
        },
        speed:400,
        effect : 'fade',
        })

      Swiper2 = new Swiper('#brand_swiper_2',{
        pagination: {
            el: '.swiper-pagination',
          },
        loop:true,
        speed:400,
        controller: {
            control: Swiper1,
          },
      })
      Swiper1.controller.control = Swiper2
      Swiper2.controller.control = Swiper1
    }
  }

}  
这样写的
<style>
  @import '../static/css/swiper-4.1.0.min.css'
</style>
这么写的，但是报错
vue.esm.js?efeb:578 [Vue warn]: Error in nextTick: "TypeError: this.lunbo is not a function"
TypeError: this.lunbo is not a function


希望能得到解决

meixing

methods: 里边的 unbo 拼写错误 改成 lunbo 后
还是报错哦

紫气东来3

可以参考一下这里 https://segmentfault.com/q/1010000012895675
这里