使用插值表达式的渲染数据的过程中,会出现dom元素闪动问题,原因是dom加载完毕后,会被重新再次渲染,此效果被用户体检造成影响,如何解决呢? 使用c-cloak可以解决该问题: c-cloak使默认的dom隐藏起来,即使DOM加载完毕,在vue数据没有渲染完毕,dom依然不显示。只有等数据渲染完毕后才会更改显示状态,此时我们就只能看到vue渲染后的DOM界面,可以解决插值表达式的闪动问题。
示例:
<!--- v-cloak的使用 ----->
<div id='app'>
<div v-cloak>{{msg}}</div>
</div>
<script>
var vm = new Vue({
el:"#app",
data:{
msg:"Hello Vue"
}
})
</script>