最近在自定义一个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. SuperSocket 1.6 创建一个简易的报文长度在头部的Socket服务器

    我们来做一个头为6位报文总长度,并且长度不包含长度域自身的例子.比如这样的Socket报文000006123456. 添加SuperSocket.Engine,直接使用Nuget搜索SuperSock ...

  2. 一文读懂数仓中的pg_stat

    摘要:GaussDB(DWS)在SQL执行过程中,会记录表增删改查相关的运行时统计信息,并在事务提交或回滚后记录到共享的内存中.这些信息可以通过 "pg_stat_all_tables视图& ...

  3. 广义径向基网络(RBF网络)

  4. Java方法的重写

    package Demo.oop.APP.Demo04; //启动器 public class application { public static void main(String[] args) ...

  5. 5-1 Vant | 移动组件库

    Vant 什么是Vant Vant是一个轻量,可靠的移动端组件库,2017开源 目前 Vant 官方提供了 Vue 2 版本.Vue 3 版本和微信小程序版本,并由社区团队维护 React 版本和支付 ...

  6. Dokcer运行Nacos容器自动退出问题

    Dokcer运行Nacos容器自动退出问题 参考博文 学生党,租的云服务器,2核2G.使用Docker运行Nacos容器的时候发现总是自动退出.Nacos日志里面没有明显的报错信息.查了一下是内存溢出 ...

  7. 平衡树——splay 二

    上文传送门:平衡树--splay 一 - yi_fan0305 - 博客园 (cnblogs.com) OK,我们继续上文,来讲一些其他操作. 七.找排名为k的数 和treap的操作很像,都是通过比较 ...

  8. MySQL基本操作笔记

    一.数值类型 1.常量(1)字符串常量 ASCII字符串常量占一个字节 例如:'Hello Word' Unicode字符串常量占两个字节 例如:N'Hello Word' mysql> sel ...

  9. python--函数参数传递

    1. 调用函数时,实参会传递给形参,叫做参数传递. 2. 根据实际参数的类型不同,函数参数的传递方式可分为 2 种,分别为值传递和引用(地址)传递: 值传递:传递的实参类型为不可变类型(字符串.数字. ...

  10. 3.联合索引、覆盖索引及最左匹配原则|MySQL索引学习

    GreatSQL社区原创内容未经授权不得随意使用,转载请联系小编并注明来源. 导语 在数据检索的过程中,经常会有多个列的匹配需求,今天介绍下联合索引的使用以及最左匹配原则的案例. 最左匹配原则作用在联 ...