Vue中的v-on同时传递event对象和其它参数

情况一：如果该方法不需要额外参数，那么方法后的()可以不添加

以下两种事件处理函数加括号和不加括号是等价的：

<div id="app">
    <button @click='submit'>按钮1</button>
    <button @click='submits()'>按钮2</button>
</div>

//js
methods:{
    submit(){
      console.log("我被点击了")
    },
}

//控制台
输出两次 我被点击了

情况二：调用的方法中需要传递参数

//html 
 <div id="app">
     <button @click='submit'>按钮1</button> //event对象
     <button @click='submit()'>按钮2</button> //undefind
     <button @click='submit(abc)'>按钮3</button> //报错+undefined，原因是把abc当成变量，找不到此变量
     <button @click='submit(123)'>按钮4</button> //123
 </div>
 
//js
 methods:{
    submit(parm){
      console.log(parm); 
    }
  }

情况三：调用的方法中同时需要传递参数和event对象

使用@click='submit(123,$event)'

//html 
<div id="app">
	 <button @click='submit'>按钮1</button>   //event对象 undefined 不加括号会自动获取event
	 <button @click='submit()'>按钮2</button>   //undefined undefined 
	 <button @click='submit(123)'>按钮3</button>  //123 undefined
	 <button @click='submit(123,event)'>按钮4</button>  //123 undefined 把event当成变量了
	 <button @click='submit(123,$event)'>按钮5</button>  //123 event对象
 </div>
//js
  methods:{
    submit(parm,event){
      console.log(parm,event); 
   }