在 Vue 的使用過程中會(huì)遇到各種場(chǎng)景，當(dāng)普通使用時(shí)覺得沒什么，但是或許優(yōu)化一下可以更高效、更優(yōu)美地進(jìn)行開發(fā)。接下來就由石家莊網(wǎng)站制作工程師分享日常開發(fā)用到的小技巧。

　　1.全局過濾器注冊(cè)

　　1.1 一般情況

　　官方注冊(cè)過濾器的方式：

　　但是對(duì)我們做項(xiàng)目來說，大部分的過濾器是要全局使用的，不會(huì)每每用到就在組件里面去寫，抽成全局的會(huì)更好些。官方注冊(cè)全局的方式：

　　1.2 優(yōu)化

　　我們可以抽出到獨(dú)立文件，然后使用 Object.keys 在 main.js 入口統(tǒng)一注冊(cè)：

　　/src/common/filters.js

　　/src/main.js

　　然后在其他的 .vue 文件中就可愉快地使用這些我們定義好的全局過濾器了。

　　2.不同路由的組件復(fù)用

　　2.1場(chǎng)景還原

　　當(dāng)某個(gè)場(chǎng)景中 vue-router從/post-page/a，跳轉(zhuǎn)到 /post-page/b。然后我們驚人地發(fā)現(xiàn)，頁(yè)面跳轉(zhuǎn)后數(shù)據(jù)竟然沒更新?!原因是 vue-router "智能的"發(fā)現(xiàn)這是同一個(gè)組件，然后它就決定要復(fù)用這個(gè)組件，所以你在 created 函數(shù)里寫的方法壓根就沒執(zhí)行。通常的解決方案是監(jiān)聽 $route 的變化來初始化數(shù)據(jù)，如下：

　　2.2 優(yōu)化

　　為了實(shí)現(xiàn)這樣的效果可以給 router-view添加一個(gè)不同的 key，這樣即使是公用組件，只要 url 變化了，就一定會(huì)重新創(chuàng)建這個(gè)組件。

　　還可以在其后加 ++newDate()時(shí)間戳，保證獨(dú)一無二。

　　如果組件被放在 中的話，可以把獲取新數(shù)據(jù)的方法放在 activated 鉤子，代替原來在 created、mounted 鉤子中獲取數(shù)據(jù)的任務(wù)。

　　以上關(guān)于Vue 使用中的小技巧屬石家莊網(wǎng)站制作工程師的個(gè)人觀點(diǎn)，大家如果對(duì)此有著不同的見解，可以關(guān)注公眾號(hào)“尚武科技”給我留言，大家可以交流一下自己的心德體會(huì)，共同學(xué)習(xí)進(jìn)步。