在vue中使用swiper插件遇到了无法找到移除事件监听问题

新手上路,请多包涵

在Vue项目中使用Swiper插件,出现

Error in nextTick: "TypeError: Cannot read property 'removeEventListener' of undefined"

引用Swiper的代码如下:
main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import VueAwesomeSwiper from 'vue-awesome-swiper'
import 'swiper/dist/css/swiper.css'
import './registerServiceWorker'

Vue.config.productionTip = false
Vue.use(VueAwesomeSwiper, /* { default global options } */)

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

html

<swiper id="mySwiper" :options="swiperOption" ref="mySwiper" @someSwiperEvent="callback">
    <swiper-slide><img src="../assets/img_banner.png"></swiper-slide>
    <swiper-slide>I'm Slide 2</swiper-slide>
    <div class="swiper-pagination"  slot="pagination"></div>
</swiper>

script

import projectItem from '@/components/projectItem.vue'
export default {
    // name: 'home',
    data () {
          return {
              swiperOption: {
                autoplay: false,
                //分页器
                pagination: {
                      el: '.swiper-pagination',
                      clickable :true,
                },
                // direction: 'vertical', // 垂直切换选项
                loop: true, // 循环模式选项
                                
                // 如果需要前进后退按钮
                navigation: {
                  nextEl: '.swiper-button-next',
                  prevEl: '.swiper-button-prev',
                },
                
                // 如果需要滚动条
                scrollbar: {
                  el: '.swiper-scrollbar',
                },
            },
            selected: 0,        //顶部所选模块
            openMine: false,    //打开我的选项
          }
    },
    methods: {
        callback () {
            
        },
        top_choice (index) {
            this.selected = index
        }
    },
    computed: {
        swiper() {
              return this.$refs.mySwiper.swiper
        }
    },
}

请问是哪里注册插件出了问题吗?

阅读 5k
2 个回答

html里没有分页器【pagination】以及前进后退按钮【navigation】的话JS里就不要绑定、这样就解决了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题