Vue.js由于延时显示了{{message}}引用界面解决方法
2016-06-20 15:45
786 查看
在使用Vue写应用时发现一个问题,每当进入一些有延时的(如网络API请求)操作时,会先闪一下未编译的 Mustache 标签{{ message }},这让人很不爽。
在官网找到了解决方案:v-cloak
参照官网做法:
定义[v-cloak]的style
使用了Mustache标签的地方加上v-cloak
这样,Vue就可以隐藏未编译的 Mustache 标签直到实例准备完毕。实测效果很棒。
在官网找到了解决方案:v-cloak
参照官网做法:
定义[v-cloak]的style
<style> [v-cloak] { display: none; } </style>
使用了Mustache标签的地方加上v-cloak
<div v-cloak>{{ message }}</div>
这样,Vue就可以隐藏未编译的 Mustache 标签直到实例准备完毕。实测效果很棒。
相关文章推荐
- VUEJS实战之修复错误并且美化时间(2)
- JavaScript的Vue.js库入门学习教程
- VUEJS实战之构建基础并渲染出列表(1)
- vueJS简单的点击显示与隐藏的效果【实现代码】
- VUEJS实战之利用laypage插件实现分页(3)
- JavaScript的MVVM库Vue.js入门学习笔记
- vue,angular,avalon这三种MVVM框架优缺点
- Vue入门之数据绑定(小结)
- JavaScript的MVVM库Vue.js入门学习笔记
- android keylayout by VUE
- Building android app first tutorial by VUE- 安卓开发教程
- vue和Jquery差别之动态添加删除元素
- MongoVUE配置文件路径
- vue.js
- 【Vue】-(1) 安装
- bootstrap得动态进度条
- 【Vue】-(2) 起步
- 【Vue】-(3) Vue与MVVM
- 【Vue】 -(4) 数据绑定语法