VUE.JS中v-cloak 的作用和出现的问题

使用 v-cloak 防止页面加载时出现 vue.js 的变量名

---

在页面加载时会闪现对应的 vuejs 变量名
这时，我们就可以在标签里加入 v-cloak 防止页面加载时出现 vue.js 的变量名
如下所示：

<div id="rrapp" v-cloak>...</div>

或

<ul v-cloak v-for="item in items">
  <li>{{ item.name }}</li>
</ul>

并且在css样式中添加

[v-cloak] {
  display: none;
}

在 vuejs instance ready 之后，v-cloak 属性会被自动去除，也就是对应的标签会变为可见

---

但是！！！！！！！！！！！！！！！
有时添加完毕后仍有部分变量会显示，这是怎么回事呢？通过控制台查看，原来是 v-cloak 的display属性被优先级别高的样式覆盖所导致，添加 !important ，css样式如下：

[v-cloak] {
  display:none!important;
}