vue：指令（插值操作、指令（v-once、v-html、v-text、v-pre、v-cloak））

1、插值操作（显示data中的数据）

（1）Mustache

Mustache也就是双大括号

（2）Mustache的基本使用

"app">
    
{{message}}
    
{{message+'  '+name}}
    
{{num*2}}

 

 

 不仅可以取出数据，还可以对取出的数据进行一些简单的计算。

 

2、基础指令

（1）v-once指令

"app">
    
{{message}}
    
{{message}}

 

 

 将响应式变成了非响应式，只会在第一次展示数据，不会随着数据的改变而改变

（2）v-html

"app">
    
{{url}}

 

 

 不添加标签的时候被解析为文本

"app">
    
{{url}}
    
"url">

 

 

 添加v-html后url可以被解析为地址

（3）v-text

"app">
    
{{message}}
    
"message">

 

 

 能够显示数据，但是与Mustache相比，v-text不够灵活

（4）v-pre

"app">
    
{{message}}
    
{{message}}

用于跳过这个元素和它的子元素的编译过程，用于显示原本的Mustache语法

（5）v-cloak

在vue解析之前，div中有一个属性v-cloak，当vue解析之后该属性就消失了