解决swiper组件autoplay报错问题
最近在自定义一个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报错问题的更多相关文章
- 解决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 ...
- Mysql备份迁移——MySqlBackup(.net)——(无法解决视图嵌视图报错)
这里是利用MySqlBackup,可以再nuget中下载. 无法解决视图嵌视图报错的问题,只导表跟数据比较合适,如果有视图嵌视图,请参照Mysql备份迁移——Mysqldump(.NET调用Mysql ...
- 解决一个报表EdmFunction报错问题
最近测试组提了一个bug,说是某个报表点击查询报错,查看错误log,错误信息如下. 类型"Ticket.Data.SqlFuns"上指定的方法"Boolean C ...
- 解决cookies存储中文报错问题
URLEncoder.encode("username", "UTF-8"); URLDecoder.decode("123", " ...
- 解决spring boot启动报错java.lang.NoClassDefFoundError: ch/qos/logback/classic/Level
解决spring boot启动报错java.lang.NoClassDefFoundError: ch/qos/logback/classic/Level 学习了:https://blog.csdn. ...
- 解决centos7下 selenium报错--unknown error: DevToolsActivePort file doesn't exist
解决centos7下 selenium报错--unknown error: DevToolsActivePort file doesn't exist 早上在linux下用selenium启动Chro ...
- 如何解决金蝶IKernel.exe报错 Windows Installer 错误 重新安装、无法卸载
如何解决金蝶IKernel.exe报错 Windows Installer 错误 金蝶这个小婊子,就是这么贱. 卸载了高版本的,再安装低版本就不能安装上,死活都不能安装. 请手动启动一下Install ...
- 完美解决 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, ...
- 解决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,重启 ...
随机推荐
- [BJDCTF2020]The mystery of ip|[CISCN2019 华东南赛区]Web11|SSTI注入
记录一下BUUCTF中两个类似的SSTI注入关卡 [BJDCTF2020]The mystery of ip-1: 1.打开之后显示如下: 2.在hint.php中进行了相关提示,如下: 3.既然获取 ...
- Android高仿网易云音乐-启动界面实现和动态权限处理
效果 实现分析 基本上没有什么难点,就是布局,然后显示用户协议对话框,动态处理权限,判断是否显示引导界面,是否显示广告界面等. 布局 <?xml version="1.0" ...
- Linux,Centos系统下配置java Jdk(附下载地址)
一.下载jdk 官网下载地址:https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html 需要登录Oracle ...
- 从解析HTML开始,破解页面渲染时间长难题
摘要:在本文中,将重点关注网页的初始渲染,即它从解析 HTML 开始. 我将探索可能导致高渲染时间的问题,以及如何解决它们. 本文分享自华为云社区<页面首屏渲染性能指南>,作者:Ocean ...
- JAVA编程练习01作业
1.已知y与x的关系:,要求:从键盘上输入一个x的值,输出其对应的y的值. 2. 输入一个圆半径(r),计算并输出圆的面积和周长. 3.输入一个三位正整数n,输出其个位.十位和百位上的数字. 4.根据 ...
- MIT 6.824 Lab2A Raft之领导者选举
实验准备 实验代码:git://g.csail.mit.edu/6.824-golabs-2021/src/raft 如何测试:go test -run 2A -race 相关论文:Raft Exte ...
- OGC WebGIS 常用服务标准(WMS/WMTS/TMS/WFS)速查
本文只介绍实际工作中常用的 WMS.WMTS.WFS.TMS 四种,WCS.WPS 等其它 OGC WebService 类型请自行查阅官方资料. 目录 0. 参数传递方式 1. WMS 速查 1.1 ...
- Thread类的常用方法_sleep和创建多线程程序的第二种方式实现Runnable接口
public static void sleep(long millis);//使当前正在执行的线程以指定的毫秒数暂停(暂时停止执行). 毫秒数结束后线程继续执行 package com.yang.T ...
- 迭代器和增强for循环
iterator 迭代:即Collection集合元素的通过获取方法,在获取元素之前先要判断集合中有没有元素,如果有就把这个元素取出来,然后在判断,如果还有就再去除卡u,一直把集合中的所有元素全部拿出 ...
- Collection集合概述和集合框架介绍
集合概述 集合:集合是java中提供的一种容器,可以用来存储多个数据 集合和数组既然都是容器,他们有什么区别? 1.数组的长度是固定的,集合的长度是可变的 2.数组中存储的是同一类型的元素,可以存储基 ...