事件处理
监听事件
v-on
指令监听 DOM 事件
- 触发时运行一些 JavaScript 代码
click事件
<div id="example-1">
<button v-on:click="counter += 1">Add 1</button>
<p>The button above has been clicked {
{ counter }} times.</p>
</div>
var example1 = new Vue({
el: '#example-1',
data: {
counter: 0
}
})
事件处理方法
将逻辑代码抽到方法中,而不是放在v-on指令里面
<div id="example-1">
<button v-on:click="getCounter">Add 1</button>
<p>The button above has been clicked {
{ counter }} times.</p>
</div>
var example1 = new Vue({
el: '#example-1',
data: {
counter: 0
},
methods