Vue指令--实时更新

1 v-bind,用于绑定属性，例如：“<a  v-bind:href="webName"></a>”

其缩写为:bind,例如：“<a  :href="webName"></a>”

2 v-html,用于添加dom片段，例如：<p v-html="websitTag"></p>

其中websitTag的内容为：“<a  v-bind:href="www.baidu.com"></a>”

3 v-on,用于添加事件，例如：<button  v-on:click="add"></button>,其中add为methods中方法，可以写成add,也可以写成add(),注methods中方法在{{}}中必须写成add()形式。

(1)事件修饰符：

<a v-on:click.stop="doThis"></a>：这样写可以阻止冒泡。

<button @click.once="add(1)">涨一岁</button>：点击只执行一次。

<a v-on:click.prevent="alert" href="www.baidu.com">点击有alert页面不跳转百度</a>:其中alert在methods的内容为：alert(1)

(2)键值修饰符：

<input type="text" v-on:keyup.enter="logAge"/>：键盘抬起的时候不会触发logAge中方法，当敲enter的时候才可以触发。

<input type="text" v-on:keyup.alt.enter="logAge"/>：键盘抬起的时候不会触发logAge中方法，当敲alt+enter的时候才可以触发。

4 v-model:功能类似于{{}}，实现数据的双向绑定。

5 v-if: