解決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.解決辦法在元素前面加個?來判斷一下 如果前面為假就不執行了

就不報錯了

當然如果你有更好的辦法請一定告訴我!!!

 

 

Tags: