2024-05-01 分類: 網(wǎng)站建設(shè)
在 Vue 的使用過程中會遇到各種場景,當普通使用時覺得沒什么,但是或許優(yōu)化一下可以更高效、更優(yōu)美地進行開發(fā)。接下來就由成都網(wǎng)站制作工程師分享日常開發(fā)用到的小技巧。
1.全局過濾器注冊
1.1 一般情況
官方注冊過濾器的方式:
但是對我們做項目來說,大部分的過濾器是要全局使用的,不會每每用到就在組件里面去寫,抽成全局的會更好些。官方注冊全局的方式:
1.2 優(yōu)化
我們可以抽出到獨立文件,然后使用 Object.keys 在 main.js 入口統(tǒng)一注冊:
/src/common/filters.js
/src/main.js
然后在其他的 .vue 文件中就可愉快地使用這些我們定義好的全局過濾器了。
2.不同路由的組件復(fù)用
2.1場景還原
當某個場景中 vue-router從/post-page/a,跳轉(zhuǎn)到 /post-page/b。然后我們驚人地發(fā)現(xiàn),頁面跳轉(zhuǎn)后數(shù)據(jù)竟然沒更新?!原因是 vue-router "智能的"發(fā)現(xiàn)這是同一個組件,然后它就決定要復(fù)用這個組件,所以你在 created 函數(shù)里寫的方法壓根就沒執(zhí)行。通常的解決方案是監(jiān)聽 $route 的變化來初始化數(shù)據(jù),如下:
2.2 優(yōu)化
為了實現(xiàn)這樣的效果可以給 router-view添加一個不同的 key,這樣即使是公用組件,只要 url 變化了,就一定會重新創(chuàng)建這個組件。
還可以在其后加 ++newDate()時間戳,保證獨一無二。
如果組件被放在 中的話,可以把獲取新數(shù)據(jù)的方法放在 activated 鉤子,代替原來在 created、mounted 鉤子中獲取數(shù)據(jù)的任務(wù)。
以上關(guān)于Vue 使用中的小技巧屬成都網(wǎng)站制作工程師的個人觀點,大家如果對此有著不同的見解,可以關(guān)注公眾號“創(chuàng)新互聯(lián)”給我留言,大家可以交流一下自己的心德體會,共同學(xué)習(xí)進步。
網(wǎng)頁題目:Vue使用中的小技巧(2)
網(wǎng)站URL:http://www.rwnh.cn/news11/327211.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站維護、云服務(wù)器、面包屑導(dǎo)航、做網(wǎng)站、建站公司、軟件開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容