干啥用的?
举个例子
<style>
</style>
<div v-cloak>
{{ message }}
</div>
结果
换个姿势
<style>
[v-cloak] {
display: none;
}
</style>
<div v-cloak>
{{ message }}
</div>
结果啥也不显示。
也就是说这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。毕竟这玩意 {{ message }}也不太好看。
当然,实例准备好了就可以显示了。
<style>
[v-cloak] {
display: none;
}
</style>
<div id="app" v-cloak>
{{ message }}
</div>
<script>
new Vue({
el:'#app',
data:{
message:'apple'
}
})
</script>
结果
So easy!