解決Vue.js由于延時顯示了{{message}}引用界面的問題
更新時間：2018年08月25日 17:09:17 作者：violet-jack
今天小編就為大家分享一篇解決Vue.js由于延時顯示了{{message}}引用界面的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
在使用Vue寫應(yīng)用時發(fā)現(xiàn)一個問題，每當(dāng)進入一些有延時的（如網(wǎng)絡(luò)API請求）操作時，會先閃一下未編譯的 Mustache 標簽{{ message }}，這讓人很不爽。
在官網(wǎng)找到了解決方案：v-cloak
參照官網(wǎng)做法：
定義[v-cloak]的style
<style>
[v-cloak] {
display: none;
}
</style>
使用了Mustache標簽的地方加上v-cloak
<div v-cloak>{{ message }}</div>
這樣，Vue就可以隱藏未編譯的 Mustache 標簽直到實例準備完畢。實測效果很棒。
以上這篇解決Vue.js由于延時顯示了{{message}}引用界面的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了記一次vue-webpack項目優(yōu)化實踐，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-02-02
vue 不使用select實現(xiàn)下拉框功能(推薦)
這篇文章主要介紹了vue 不使用select實現(xiàn)下拉框功能,在文章給大家提到了vue select 組件的使用與禁用，需要的朋友可以參考下2018-05-05
這篇文章主要介紹了vue中使用canvas繪圖方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-09-09
這篇文章主要介紹了vue雙向數(shù)據(jù)綁定的原理以及知識點總結(jié)，并做了代碼實例分析，有需要的朋友參考下。2018-04-04
這篇文章主要為大家詳細介紹了Vue組件實現(xiàn)觸底判斷，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
這篇文章主要給大家介紹了關(guān)于vue3.0中使用element的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
這篇文章主要為大家詳細介紹了vue實現(xiàn)文字滾動效果，公告滾動播放，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
這篇文章主要介紹了vue3 axios安裝及使用示例代碼,本文通過示例代碼給大家介紹的非常詳細,感興趣的朋友跟隨小編一起看看吧2024-04-04
在許多應(yīng)用程序中，我們經(jīng)常需要執(zhí)行定期的異步任務(wù)輪詢，本文就介紹了Vue3如何處理異步任務(wù)輪詢，感興趣的可以了解一下2023-05-05
Vue Object.defineProperty及ProxyVue實現(xiàn)雙向數(shù)據(jù)綁定
這篇文章主要介紹了Vue Object.defineProperty及ProxyVue實現(xiàn)雙向數(shù)據(jù)綁定,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-09-09