页面加载时闪烁一下vue的插值表达式{{变量名}}，使用v-cloak轻松解决！

在我们使用vue时，页面加载时有可能会出现先闪烁一下差值表达式，然后才恢复正常的情况，例如：

页面加载时会先这样闪烁一下（当然不是每次都会有这种情况,这里只是举个例子）

然后才恢复正常

想要解决只需要两步即可：

1. css代码（注：该段css样式最好放在style最开头的地方）

   /*防止页面加载时闪烁{{变量}}*/
   [v-cloak] {
   	display: none !important;
   }
   

2. html代码（v-cloak属性可以放在特定标签里:只对该标签起作用； 也可放在Vue对象所绑定的最外层div上:对该div及所有子元素都起作用）

   <!-- 两种方式，根据需求自选 -->
   <!-- 放在特定标签里:只对该标签起作用  若有其他标签也有类似情况的话需要逐个添加该属性 -->
   <div id="app">
       <span v-cloak>
           {{message}}
       </span>
   </div>
   
   <!-- 放在Vue对象所绑定的最外层div上:对该div及所有子元素都起作用  一劳永逸，只需要加一个地方即可 -->
   <div id="app" v-cloak>
       <span>
           {{message}}
       </span>
   </div>
   

这样便可解决加载时闪烁的问题啦！