Vue3 project using Ts: Type "(XXX?: boolean) => void" cannot be assigned to type "(payload: MouseEvent) => void"

When the event-bound function does not pass a value, the first parameter of the function defaults to $event and the type is "MouseEvent".

Solution: Just pass a default parameter. The sample code is as follows:

<template>
  <!-- <div class="title" @click="showDialog">{
    
    {
    
     navTitle }}</div> -->
  <div class="title" @click="showDialog(true)">{
    
    {
    
     navTitle }}</div>
</template>

<script lang="ts">
import {
    
     defineComponent, inject, reactive, toRefs, watch } from 'vue'
export default defineComponent({
    
    
  name: 'InfoModule',
  setup () {
    
    
    const data = reactive({
    
    
      showTitleDialog: false, // 弹窗是否显示
      navTitle: ''
    })
    // 点击标题显示弹窗
    const showDialog = (val = true) => {
    
    
      data.showTitleDialog = val
    }

    return {
    
    
      showDialog,
      ...toRefs(data)
    }
  }
})
</script>