應該是 Vue 對函數調用表達式額外用了一個函數做了層包裝。
事先說明：加與不加括號的區別在於事件對象參數 event 的處理。不加括號時，函數第一個參數為 event，加了括號后，需要手動傳入 $event 才能獲得事件對象。
1、如果事件綁定的方法沒有參數可以選擇加括號也可以不加括號
1 <template>
2 <div>
3 <input type="button" value="按鈕1" v-on:click="fn">
4 <input type="button" value="按鈕2" v-on:click="fn()">
5 </div>
6 </template>
7
8 <script>
9 export default { 10 data() { 11 return { 12 a:10
13 } 14 }, 15 methods:{ 16 fun(){ 17 console.log(this.a) 18 } 19 } 20 } 21 </script>
上面的函數調用的時候，加不加括號，效果是一樣的。
2、如果不加括號，函數的第一個參數為 event 。
1 <template>
2 <div>
3 <input type="button" value="按鈕1" v-on:click="fn">
4 </div>
5 </template>
6
7 <script>
8 export default { 9 data() { 10 return { 11 a:10
12 } 13 }, 14 methods:{ 15 fun(e){ 16 console.log(e) 17 } 18 } 19 } 20 </script>
3、如果加了括號，需要手動傳入 $event 才能獲得事件對象。
<template>
<div>
<input type="button" value="按鈕1" v-on:click="fn($event)">
</div>
</template>
<script> export default { data() { return { a:10 } }, methods:{ fun(e){ console.log(e) } } } </script>
如果 v-on:click="fn()" 這里不手動添加 $event ，那么 fun 函數里面的 console.log(e) 打印出來的就是 undefined 。
4、父子組件的引用：
涉及到父子組件的引用，有時候需要傳遞額外的參數，必須加括號，第一個參數為 $event ，后面跟額外的參數，具體可參考 vue父子組件之間的傳額外的參數