vue小白教程-3 本地应用指令上 （ v-text、v-html、v-on）

vue指令可以分为：     ●内容绑定，事件绑定

                                    ●显示切换，属性绑定

                                    ●列表循环，表单元素绑定

 

1.v-text

它设置标签的文本值。效果等同关于{{}}} 另''也可以直接包含文本内容。写法如下：

<h6 v-text="message"></h6>

2.v-html

它设置标签的innerHTML。如果设置普通文本则同v-text，如果设置html结构会是标签，html例子如下：

输出结果：

点击箭头处会连接到代码中网址

3.v-on

它为元素绑定事件

绑定点击、双击等事件

指令在@中 绑定方法定义在methods中 方法内部可以用this访问data中数据。

点击图中按钮后效果如下：