Vue部分编译不生效,解决Vue渲染时候会闪一下
程序员文章站
2022-06-02 08:49:31
0828自我总结 Vue部分编译不生效,解决Vue渲染时候会闪一下 一.Vue编译不生效 在标签里添加 二.解决Vue渲染时候会闪一下 方法一: 方法二: 利用 在加载vue完成后他会消失,专业术语叫斗篷 ......
vue部分编译不生效,解决vue渲染时候会闪一下
一.vue编译不生效
在标签里添加v-pre
<script src="vue.js"></script> <div> <p v-pre>{{msg}}</p> //网页中显示{{msg}} <p >{{msg}}</p> //网页中显示66 </div> <script> new vue({ el:'div', data:{ msg:'66' }, }) </script>
二.解决vue渲染时候会闪一下
方法一:
将导入vue放在需要用vue编译的位置前面
<script src="vue.js"></script> //导入放前面 <div> <p >{{msg}}</p> //网页中显示66 </div> <script> new vue({ el:'div', data:{ msg:'66' }, }) </script>
方法二:
利用v-cloak
在加载vue完成后他会消失,专业术语叫斗篷
<style> [v-cloak]{display:none} <</style> <div> <p v-cloak>{{msg}}</p> </div> <script src="vue.js"></script> <script> new vue({ el:'div', data:{ msg:'66' }, }) </script>
下一篇: 设计模式之状态模式(二)