# 体验指令v-text|v-clock
从上面我们可以发现当网页比较慢的时候,js还没有加载完时,会出现 一闪的情况。
![](https://box.kancloud.cn/ce0765d7266704361159a14a39846824_294x233.gif)
## 解决办法01:
通过指令实现:指令是书写在html标签身上的功能。是Vue框架赋予了这个属性的一些功能。
特点:书写在标签属性上,当网络不友好时,也不显示其它字符,等全部加载完,再显示到页面中。
`v-html` 或者`v-text`
```html
<div id="app">
<span v-text="str"></span>
</div>
<script src="vue.js"></script>
<script>
var vm = new Vue({
el:'#app',
data:{
str:'你好'
}
})
</script>
```
方法1固然好,不过也会带来麻烦 。因为我们在html标签的内容通过`{{}}`语法书写内容,非常灵活。而写在`v-text`内部会显得臃肿,而且效果还要进行字符串拼接。
如下:
```html
<div id="app">
<span>{{str}}你好</span>
</div>
```
```html
<div id="app">
<span v-text="str+'你好'"></span>
</div>
```
## 解决办法02:斗篷(隐身衣)
新方法`v-cloak`:
书写样式`[v-cloak]`可以让书写vue代码的部分全部隐藏。等Vue代码加载和编译完全,会让其显示出来。这样就不会有跳的感觉。
```html
<style>
[v-cloak]{display: none;}
</style>
<div id="app" v-cloak>
<span>{{str}}</span>
</div>
<script src="vue.js"></script>
<script>
var vm = new Vue({
el:'#app',
data:{
str:'你好'
}
})
</script>
```