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

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

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

具体错误:

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

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

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

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

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

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

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

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

6.查找浏览器报错代码

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

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

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

就不报错了

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

 

解决swiper组件autoplay报错问题的更多相关文章

  1. 解决eclipse spring配置报错:cvc-elt.1: Cannot find the declaration of element

    解决eclipse spring配置报错:cvc-elt.1: Cannot find the declaration of element 'beans'.Referenced file conta ...

  2. Mysql备份迁移——MySqlBackup(.net)——(无法解决视图嵌视图报错)

    这里是利用MySqlBackup,可以再nuget中下载. 无法解决视图嵌视图报错的问题,只导表跟数据比较合适,如果有视图嵌视图,请参照Mysql备份迁移——Mysqldump(.NET调用Mysql ...

  3. 解决一个报表EdmFunction报错问题

        最近测试组提了一个bug,说是某个报表点击查询报错,查看错误log,错误信息如下. 类型"Ticket.Data.SqlFuns"上指定的方法"Boolean C ...

  4. 解决cookies存储中文报错问题

    URLEncoder.encode("username", "UTF-8"); URLDecoder.decode("123", " ...

  5. 解决spring boot启动报错java.lang.NoClassDefFoundError: ch/qos/logback/classic/Level

    解决spring boot启动报错java.lang.NoClassDefFoundError: ch/qos/logback/classic/Level 学习了:https://blog.csdn. ...

  6. 解决centos7下 selenium报错--unknown error: DevToolsActivePort file doesn't exist

    解决centos7下 selenium报错--unknown error: DevToolsActivePort file doesn't exist 早上在linux下用selenium启动Chro ...

  7. 如何解决金蝶IKernel.exe报错 Windows Installer 错误 重新安装、无法卸载

    如何解决金蝶IKernel.exe报错 Windows Installer 错误 金蝶这个小婊子,就是这么贱. 卸载了高版本的,再安装低版本就不能安装上,死活都不能安装. 请手动启动一下Install ...

  8. 完美解决 scipy.misc.imread 报错 TypeError: Image data cannot be converted to float

    File "/home/harrison/anaconda3/lib/python3.7/site-packages/matplotlib/image.py", line 634, ...

  9. 解决vue安装less报错Failed to compile with 1 errors的问题

    1.创建vue项目后安装less,执行 npm install less less-loader --save-dev 下载版本为:less-loader@6.1.0 , less@3.11.3,重启 ...

随机推荐

  1. Node.js精进(8)——错误处理

    在 Node.js 中,提供了 error 模块,并且内置了标准的 JavaScript 错误,常见的有: EvalError:在调用 eval() 函数时出现问题时抛出该错误. SyntaxErro ...

  2. Tapdata 实时数据融合平台解决方案(四):技术选型

    作者介绍:TJ,唐建法,Tapdata 钛铂数据CTO,MongoDB中文社区主席,原MongoDB大中华区首席架构师,极客时间MongoDB视频课程讲师. 常见搭建数据中台的技术产品 数据中台包括: ...

  3. GRAPH CONVOLUTIONAL NETWORK WITH SEQUENTIAL ATTENTION FOR GOAL-ORIENTED DIALOGUE SYSTEMS

    面向领域特定目标的对话系统通常需要建模三种类型的输入,即(i)与领域相关的知识库,(ii)对话的历史(即话语序列)和(iii)需要生成响应的当前话语. 在对这些输入进行建模时,当前最先进的模型(如Me ...

  4. go-zero微服务实战系列(十一、大结局)

    本篇是整个系列的最后一篇了,本来打算在系列的最后一两篇写一下关于k8s部署相关的内容,在构思的过程中觉得自己对k8s知识的掌握还很不足,在自己没有理解掌握的前提下我觉得也很难写出自己满意的文章,大家看 ...

  5. 螣龙安科:威胁研究——与MAZE勒索软件事件相关的策略,技术和程序

    至少从2019年5月开始,恶意行为者就一直在积极部署MAZE勒索软件.勒索软件最初是通过垃圾邮件和漏洞利用工具包分发的,后来又转移到妥协后进行部署.根据我们在地下论坛中对涉嫌用户的观察以及整个Mand ...

  6. Josephus问题(Ⅰ)

    题目描述 n个人排成一圈,按顺时针方向依次编号1,2,3-n.从编号为1的人开始顺时针"一二"报数,报到2的人退出圈子.这样不断循环下去,圈子里的人将不断减少.最终一定会剩下一个人 ...

  7. C++指针和结构体基础知识

    学习C++首先要回忆起C语言当中的指针和结构体知识,本文作者将通过一段代码来总结指针和结构体基础知识:指针是一个变量,其值为另一个变量的地址,即,内存位置的直接地址.就像其他变量或常量一样,您必须在使 ...

  8. Java之struts2框架学习

    Java之struts2框架学习 About Struts2 Struts也是一款MVC框架 , Struts2是Struts的下一代产品,是在Struts1和WebWork的技术基础上进行了合并的全 ...

  9. Ask.com用过什么名字?

    搜索引擎 Ask.com 曾是美国第三,世界第六大公网搜索引擎,仅次于 Google 搜索.Bing 和百度.NAVER.Yandex. Ask.com 曾经用过什么名字? Ask Jetson As ...

  10. Matplotlib(基本用法)

    Matplotlib 是数据分析绘图的常见模块,可以算是 2D-绘图(Python)领域使用最广泛的套件,可以将数据图形化,并且提供多样化的输出格式,利于数据的显示并分析. 接下来展示的是Matplo ...