浅谈Vue.js 中的 v-on 事件指令的使用

<div id=\"app\">
 <h3>已点击 {{count}} 次</h3>
 <button @click=\"count++\">点我</button>
</div>

< >
 var app = new Vue({
  el: \'#app\',
  data: {
   count:0
  }
 });
</ >

<button @click=\"quickAdd(3)\">快速增长</button>

methods: {
 quickAdd: function (i) {
  i = i || 1;//为避免参数为 null 或 undefined 值，这里设定了默认值 1
  this.count += i;
 }
}

<div id=\"app2\">
 <a href=\"www.163.com\" rel=\"external nofollow\" @click=\"openUrl(\'被禁用咯\',$event)\">被禁用咯</a>
</div>

var app2 = new Vue({
 el: \'#app2\',
 data: {
  count: 0
 },
 methods: {
  openUrl: function (param, event) {
   event.preventDefault();
   console.log(\"param:\" + param);
  }
 }
});

<div id=\"app3\">
 <input @keyup.13=\"enterClick\">
</div>

var app3 = new Vue({
 el: \'#app3\',
 data: {},
 methods: {
  enterClick: function () {
   console.log(\"enterClick\");
  }
 }
});

<div id=\"app4\">
 <input @keyup.alt.83=\"save\">
</div>

var app4 = new Vue({
 el: \'#app4\',
 data: {},
 methods: {
  save: function () {
   console.log(\"save\");
  }
 }
});