SOURCE

var vm = new Vue({
  el: '#app',
  data: function(){
    return {
      num: 0,
      messages: ["点击后可以改变我","我还可以带参数","使用$event可以对原生的dom事件操作"]
    }
  },
  methods: {
    change: function(){
      this.$set(this.messages, 0, "我是点击后的文字")
    },
    clickMe: function(arg){
      this.$set(this.messages, 1, arg.arg)
    },
    clickEvt: function(arg, event){
      this.$set(this.messages, 2, event.type)
    }
  }
})
function domClick(){
  alert('我被点击了')
}

<div id="app">
  <div>
    <div>{{num}}</div>
    <button @click="num++">click</button>
  </div>
  <div>
    <div>{{messages[0]}}</div>
    <button @click="change">click</button>
  </div>
  <div>
    <button onclick="domClick">domClick</button>
  </div>
  <div>
    <div>{{messages[1]}}</div>
    <button @click="clickMe({arg:'我是参数！'})">click</button>
  </div>
  <div>
    <div>{{messages[2]}}</div>
    <button @click.stop="clickEvt({arg:'我是参数！'}, $event)">click</button>
  </div>
</div>

#app{
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  max-width: 750px;
  text-align: center;
}