window.onresize在vue中只能使用一次,自適應(yīng)resize報(bào)錯(cuò)問題
更新時(shí)間：2023年10月21日 15:07:02 作者：虎鯨大大
這篇文章主要介紹了window.onresize在vue中只能使用一次,自適應(yīng)resize報(bào)錯(cuò)問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
window.onresize在vue中只能使用一次,自適應(yīng)resize報(bào)錯(cuò)
1.window.onresize不能重復(fù)使用
因?yàn)閛nresize是一個(gè)回調(diào)，當(dāng)它發(fā)生變化時(shí)，會(huì)覆蓋前一個(gè)
2.但是有業(yè)務(wù)場(chǎng)景需要多個(gè)組件進(jìn)行監(jiān)聽
此時(shí)可以使用
window.addEventListener('resize',()=>{})3.移除監(jiān)聽
window.removeEventListener('resize',函數(shù)名)
4.寫echars自適應(yīng)時(shí)報(bào)錯(cuò)找不到resize
使用了this，
第一次是在mounted生命周期函數(shù)中實(shí)例化echarts對(duì)象，this是指向VueComponent組件，就是柱狀圖的div；
第二次是在window監(jiān)聽事件中監(jiān)聽窗口尺寸的自適應(yīng)，this則是指向監(jiān)聽對(duì)象，也就是window，但是在這里需要的是在window的監(jiān)聽對(duì)象中對(duì)柱狀圖div進(jìn)行自適應(yīng)操作。
解決辦法：
去掉this，使用變量代替
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue 擴(kuò)展現(xiàn)有組件的操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-08-08
這篇文章主要介紹了Vue中使用插槽（slot）、聚類插槽，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
vue elementUI使用tabs與導(dǎo)航欄聯(lián)動(dòng)
這篇文章主要為大家詳細(xì)介紹了vue elementUI使用tabs與導(dǎo)航欄聯(lián)動(dòng)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-06-06
這篇文章主要介紹了vue實(shí)現(xiàn)引入本地json的方法,結(jié)合實(shí)例形式分析了vue.js加載本地json文件及解析json數(shù)據(jù)相關(guān)操作技巧,需要的朋友可以參考下2018-07-07
VueQuillEditor富文本上傳圖片(非base64)
這篇文章主要介紹了VueQuillEditor富文本上傳圖片(非base64),文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06
vscode中vue-cli項(xiàng)目es-lint的配置方法
本文主要介紹vscode中 vue項(xiàng)目es-lint的配置方法，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的的朋友參考下吧2018-07-07
解決vue單頁面多個(gè)組件嵌套監(jiān)聽瀏覽器窗口變化問題
這篇文章主要介紹了解決vue單頁面多個(gè)組件嵌套監(jiān)聽瀏覽器窗口變化問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-07-07
vue循環(huán)數(shù)據(jù)v-for / v-if最后一條問題
這篇文章主要介紹了vue循環(huán)數(shù)據(jù)v-for / v-if最后一條問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
vue3.0響應(yīng)式函數(shù)原理詳細(xì)
這篇文章主要介紹了vue3.0響應(yīng)式函數(shù)原理，Vue3的響應(yīng)式系統(tǒng)可以監(jiān)聽動(dòng)態(tài)添加的屬性還可以監(jiān)聽屬性的刪除操作，以及數(shù)組的索引以及l(fā)ength屬性的修改操作。另外Vue3的響應(yīng)式系統(tǒng)還可以作為模塊單獨(dú)使用。下面更多介紹，需要的小伙伴可以才可以參考一下2022-02-02
這篇文章主要介紹了vue關(guān)于下載文件常用的幾種方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10