iT邦幫忙

0

Vue3生命週期呼叫jquery套件問題

大家好,我目前剛接觸到Vue.js
那我有一個疑問是我目前無法解決的問題
我有用jquery套件,我在mounted的時候呼叫這些他很棒的為我工作
https://ithelp.ithome.com.tw/upload/images/20210610/20127159iMiRPrpsEW.jpg
但問題是當我有用v-if v-else的時候
切換過去切換回來就會失去效果,我發現是那些套件讀取的問題
我嘗試在各個生命週期添加我的jquery套件 還是無法解決
想請問各位大大是不是我有哪裡誤會了
下圖為正常情況顯示
https://ithelp.ithome.com.tw/upload/images/20210610/20127159acGPIk1g2x.jpg
切換到產業類別
https://ithelp.ithome.com.tw/upload/images/20210610/20127159gJW8JnPQ87.jpg
在切換回來
https://ithelp.ithome.com.tw/upload/images/20210610/20127159VEGLn5tKjc.jpg

如果有哪些資訊還不夠再麻煩告知我我將會提供QQ

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

2
froce
iT邦大師 1 級 ‧ 2021-06-11 08:40:57
最佳解答

v-if會消滅那些組件,所以你在切換回來的時候得重新綁定jQuery事件。

建議(3選1):

  1. 把要用到 JQ 的地方獨立出來成為一個子組件,在子組件生命週期的mounted裡綁事件,這樣應該每次v-if重新生成的組件就會重新綁定。
  2. v-if改v-show,組件繼續存在,只是看不到,你就不用重新綁。
  3. (最建議)不要用 JQ,vue的生態系算很成熟了,你要的東西都有,直接操作DOM效能也不好。
Mikey iT邦新手 5 級 ‧ 2021-06-11 11:34:39 檢舉

Hi很感謝您對我的回覆
我使用component來解決了我的問題!
關於Vue使用JQ的問題我還在尋找解決的方法 也真的很謝謝您給我的意見!
BestRegards!

我要發表回答

立即登入回答