原文CSS:[v-cloak] { display: none;}HTML :<div v-cloak> {{ message }}</div>其中v-cloak官方解释：这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时，这个指令可以隐藏未编译的 Mustach... 浏览器渲染机制，解析html结构 -> 加载 外部脚本和样式表文件 -> 解析并执行脚本 代码 -> 构造html dom模型 -> 加载 图片等外部文件 -> 页面 加载 完 毕。 初始化 vue 的js写在 页面 底部，也就是最后才执行js脚本。 所以 页面 从头到尾开始渲染时，渲染到标签时，由于 vue 还未初始化，所以就 会 显示 类似这样的 代码 <h2>{{courseName}}</h2> 当网速很慢的时候就看得比较清楚，可能 会 让用户误以为bug之类的，快一点的话就是一闪而过，体验不是很好 解决办法： 1、网上说的很多都是用v-cloak， <div id=app> {{con 当 vue 需要 加载 数据多或者网络慢时， 加载 数据时候 会 先出现 vue 模板（例如item.name），用户体验特别不好 解决 方法 ： 1、可以通过 VUE 内置的指令v-cloak解决这个问题（推荐） 具体实现： {{ item.name }}