swiper点击不生效问题

 原因：当设置loop：true时会出现这种问题 因为 swiper通过复制dom节点来实现无限滚动，但没有复制元素上绑定的事件

解决办法：

<swiper :options="swiperOption" ref="mySwiper" @mouseenter.native="mouseEnter"
           @mouseleave.native="mouseLeave">
   <swiper-slide v-for="(item, index) in swiperList" :key="index">
     <img :src="item.img" alt="" :data-type="item.url" />
     <div class="system-name" :data-type="item.url">{{ item.name }}</div>
   </swiper-slide>
</swiper>// 添加了一个data-type

            swiperOption: {
                loop: true,
                slidesPerView: 3, // 一页放多少个图片
                spaceBetween: 30,
                centeredSlides: true,
                autoplay: {
                    delay: 3000,
                    stopOnLastSlide: false,
                    disableOnInteraction: false,
                },
                preventLinksPropagation: false,
                // autoplay: false
                on: {
                    click: function (e) {
                        vm.routeLink(e.target.dataset.type)
                    },
                },
                navigation: {
                    nextEl: '.swiper-button-next',
                    prevEl: '.swiper-button-prev',
                },
            },//添加了on

如果点击的是滑动中一个内的一小部分时：swiper 点击事件无效的问题_swiper navigation 点击时间无效_windy-boy的博客-CSDN博客