vue教程1-04 事件 v-on:click="函数"

vue教程1-04 事件 v-on:click="函数"  

v-on:click/mouseout/mouseover/dblclick/mousedown.....

实例:为data添加数据

实例,点击按钮,div显示/隐藏切换

实例,vue实现简易留言本

v-on:click/mouseout/mouseover/dblclick/mousedown..... </span><span style="color: #0000ff;"&gt;new</span><span style="color: #000000;"&gt; Vue({ el:</span>'#box'<span style="color: #000000;"&gt;,data:{ </span><span style="color: #008000;"&gt;//</span><span style="color: #008000;"&gt;数据</span> arr:['apple','banana','orange','pear'<span style="color: #000000;"&gt;],json:{a:</span>'apple',b:'banana',c:'orange'<span style="color: #000000;"&gt;} },<span style="color: #ff0000;"&gt;methods</span>:{ <span style="color: #ff0000;"&gt;show</span>:</span><span style="color: #0000ff;"&gt;function</span>(){ <span style="color: #008000;"&gt;//</span><span style="color: #008000;"&gt;方法,这里是show,不能用alert</span> alert(1<span style="color: #000000;"&gt;); } } });</span></pre>

 

实例:为data添加数据

 

 实例:点击按钮,div显示/消失,切换。v-show="a"

">
>
    </div>
</div>