vue 元素绑定的@click方法失效问题

今天做项目时发现一个在元素绑定的事件不生效的问题，作此记录以提醒自己。具体代码如下：

<el-button @click="clickFun">按钮111</el-button>
<button @click="clickFun([1,2,3,4])">按钮222</button>


import {
    
    getInfo} from './api/test.js' //api接口
export default {
    
    
	name: 'test',
	data(){
    
    
		return {
    
    }
	},
	methods: {
    
    
		async clickFun(type){
    
    
			//调用api接口： getInfo
			const {
    
     msg } = await getInfo({
    
    
              roleId: 1111,
              id: type ? type.split(',') : [1,2,3],
          })
		}
	}
}

问题描述：点击按钮111，clickFun 方法函数没有触发，点击按钮222，clickFun 方法函数触发了

不生效的原因是：

1、按钮111的@click方法直接写成clickFun时，clickFun方法中入参type值就是当前事件Event此时就会执行三元运算条件为true的表达式，即：type.split(’,’) 。而Event没有split方法，所以报错，事件无响应；

2、按钮111的@click方法写成clickFun(),clickFun方法中入参type值就是undefined，执行三元运算条件为false的表达式，即：[1,2,3]

解决办法：

<el-button @click="clickFun()">按钮111</el-button>