解决swiper组件autoplay报错问题

时间:2022-09-18 11:07:45

最近在自定义一个swiper 插件 发现引用之后不定时一直在报错

Uncaught TypeError: Cannot read properties of undefined (reading 'addEventListener')

一个undefined一直被监听事件而且有时候有有时候没有在后续过程中不定时的报错很苦恼

具体错误:

解决swiper组件autoplay报错问题

看了一下是swiper 的autoplay 文件有问题 而且这个问题只要页面一离开就会报错 

解决方法(改源码的小方法)

1. 到node_modules文件中找到自己下载的swiper  文件

解决swiper组件autoplay报错问题

2. 我引入的文件是swiper/bundle 文件 

// 引入库
import Swiper from "swiper/bundle";

3. 当然你可以去找到swiper 的package.json文件找到你引入的地址对应的文件(如果你直接引入就是那个主文件main)

解决swiper组件autoplay报错问题

4.然后到swiper-bundle.esm.js文件找到那个出问题的包modules/autoplay/autoplay.js

解决swiper组件autoplay报错问题

5.然后vscode 可以直接按住ctrl 点击就能进入文件里面

6.查找浏览器报错代码

解决swiper组件autoplay报错问题

 

 

7.然后ctrl + f 查找一下 报错的代码swiper.$wrapperEl[0].addEventListener(event, onTransitionEnd

解决swiper组件autoplay报错问题

 

8.打印一下这个被监听的元素  发现不定时找不到这个元素

解决swiper组件autoplay报错问题

解决swiper组件autoplay报错问题

9.解决办法在元素前面加个?来判断一下 如果前面为假就不执行了

解决swiper组件autoplay报错问题

就不报错了

解决swiper组件autoplay报错问题

当然如果你有更好的办法请一定告诉我!!!