vue3+ts defineEmits update使用，v-model:visible 子组件传递数据给父组件

//父组件
<div>
 <Dialog
    v-if="visible"
    v-model:visible="visible"
  />
  <el-button @click = "visible=true">打开弹窗<el-button/>
</div>
<script lang="ts" setup>
import {
      
      ref}from 'vue'
let visible = ref(false)
</script>

//子组件Dialog
<template>
 <el-dialog v-model="_visible" title="Add Data Value" width="60%" destroy-on-close @close="onClose">
    <el-form label-width="150px" inline>
      <el-form-item >
        <el-input v-model="form.name" prop="name"  />
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script lang="ts" setup>
const emits = defineEmits<{
      
      
  (e: 'update:visible', value: boolean): void;//无需在父组件注册update:visible
}>();
let form = reactive({
      
      name:""})
const _visible = computed({
      
      
  get: () => props.visible,
  set: value => emits('update:visible', value),
});
const onClose = () => {
      
      
  emits('update:visible', false);//无需在父组件注册update:visible事件，即可改变父组件的visible值
};
</script>