解决vue.js页面加载未完成时乱码

简介: 解决vue.js页面加载未完成时乱码

 使用vue时遇到一个问题,vue没有渲染完成时,会短暂的显示不带样式的代码,为了解决这个问题,查找了一遍手册发现可以使用v-cloak。

   这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时,这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。

示例:

[v-cloak] {
display: none;
}
<div v-cloak>
{{ message }}
</div>

v-cloak 编译结束后才会显示,就不会显示没编译的内容了。


相关文章
|
7月前
|
缓存 JavaScript 前端开发
JavaScript 性能优化:如何减少页面加载时间?
JavaScript 性能优化:如何减少页面加载时间?
108 0
|
6月前
|
JavaScript 前端开发
页面加载时执行特定的 JavaScript 代码
页面加载时执行特定的 JavaScript 代码
|
7月前
|
JavaScript 前端开发
JS页面加载事件
JS页面加载事件
|
7月前
|
JavaScript 前端开发 Go
页面加载的过程中,JS 文件是不是一定会阻塞 DOM 和 CSSOM 的构建?
页面加载的过程中,JS 文件是不是一定会阻塞 DOM 和 CSSOM 的构建?
63 0
|
7月前
|
JavaScript 前端开发
原生JavaScript JS导出blob后台文件流xlsx、xls文件自动下载(且规避乱码),解决导出Excel文件里面有[object Object]。
原生JavaScript JS导出blob后台文件流xlsx、xls文件自动下载(且规避乱码),解决导出Excel文件里面有[object Object]。
|
JavaScript 前端开发 CDN
Vue 打包 chunk-vendors.js 文件过大导致页面加载缓慢解决方案
Vue 打包 chunk-vendors.js 文件过大导致页面加载缓慢解决方案
2120 0
|
Web App开发 SQL 前端开发
页面加载时会被 JS 和 CSS 阻塞吗?
之前写了两篇文章,涉及到了页面访问整个过程的一些分析,比如页面生命周期的介绍,页面访问时渲染过程中 HTML、JS 的关系,前面两篇只是抓住了 JS,没有囊括 CSS,并且在复现上没
|
JavaScript 应用服务中间件
JS 生成表格后 ,中文显示乱码
JS 生成表格后 ,中文显示乱码
228 0
JS 生成表格后 ,中文显示乱码
|
JavaScript
js中页面加载完成后执行的几种方式及执行顺序
js中页面加载完成后执行的几种方式及执行顺序
580 0
|
JavaScript 前端开发
【JavaScript】获取地址栏的参数防止乱码
【JavaScript】获取地址栏的参数防止乱码
90 0