问题的出现：做一个uniapp+vue3+ts的项目的时候，有个函数在button标签的click事件和其他方都有被调用，并且这个函数的入参有默认值。
以下是新创建的项目复现的代码：
<template>
<button @click="clickFn">clickFn</button>
</template>
<script setup lang="ts">
import { onMounted } from "vue";
function clickFn(a:number=0) {
console.log("clickFn", a);
}
onMounted(()=>{
console.log("其它要用到clickFn函数的地方")
clickFn()
clickFn(1)
})
</script>运行结果：
此时把鼠标悬浮在button标签的”click“上就出现了这个问题：
虽然底下有红线，但是也能用！
按下按钮，预想”a“打印出来的是0，可结果是：
原因：click事件绑定的函数不传值时，click事件触发的函数第一个入参默认返回$event，类型是”MouseEvent“，如果绑定函数的第一个入参为其他类型，就会出现这个问题；触发click事件，函数的第一个入参输出的不是自己写的默认值，而是$event。
这么写：
<button @click="clickFn">clickFn</button>相当于：
<button @click="clickFn($event)">clickFn</button>解决：给click事件绑定的函数给一个默认的入参就好了：
<button @click="clickFn(0)">clickFn</button>
文章为作者独立观点，不代表股票交易接口观点
股民评论