vue框架:v-cloak指令属性的基本使用
vue框架-v-cloak指令属性的基本使用
1.v-cloak
使用v-cloak主要为了解决插值表达式的闪烁问题
使用插值表达式的问题：
在页面加载的过程中，在页面中的{{}}插值表达式首先会被页面认可为是html元素中的实在存在的内容。所以浏览器会首先将{{}}展现在页面上，页面加载完毕后，插值表达式{{}}才会真正的转变为动态赋予的值。这就会造成一种现象，如果将来终端在访问服务器的过程中，网速较慢（网络比较卡），那么我们的{{}}会首先展现出来，{{}}展现出来之后，会一闪而过，最终显示的是最终被赋予的值.这就是前端开发中所谓的，插值表达式的闪烁问题。
<style>
[v-cloak]{display:none}
</style>
<p v-cloak>{{str1}}</p>
点击查看演示
1.v-cloak
使用v-cloak主要为了解决插值表达式的闪烁问题
使用插值表达式的问题：
在页面加载的过程中，在页面中的{{}}插值表达式首先会被页面认可为是html元素中的实在存在的内容。所以浏览器会首先将{{}}展现在页面上，页面加载完毕后，插值表达式{{}}才会真正的转变为动态赋予的值。这就会造成一种现象，如果将来终端在访问服务器的过程中，网速较慢（网络比较卡），那么我们的{{}}会首先展现出来，{{}}展现出来之后，会一闪而过，最终显示的是最终被赋予的值.这就是前端开发中所谓的，插值表达式的闪烁问题。
<style>
[v-cloak]{display:none}
</style>
<p v-cloak>{{str1}}</p>
点击查看演示
联系客服