如何避免在Vue.js接管之前在页面上显示{{expr}} flash？

Question

例如,我在一个页面中有一些大量的跨度(超过300个),每个跨度都有{{expr}}绑定来显示其内容:

<span>{{expr}}</span>

在页面加载后,文字{{expr}}将在VueJS接管之前闪烁显示在页面上并显示实际的绑定值.这对客户来说很糟糕,有没有办法避免它？

Answer 1

v-cloak 是您要查找的HTML属性.

该指令将保留在元素上,直到关联的Vue实例完成编译.结合CSS规则[v-cloak] { display: none },该指令可用于隐藏未编译的胡须绑定,直到Vue实例准备就绪.