vue3中如何表示 :visible.sync="dialogVisible

在 Vue 3 中，可以使用 `v-model` 指令来实现 `.sync` 修饰符的功能。在模板中，可以这样表示：

<ChildComponent v-model:visible="dialogVisible" />

在 `ChildComponent` 中，可以通过 `emits` 选项来声明一个名为 `update:visible` 的事件，将 `visible` 的变化通知给父组件，例如：

<template>
  <div v-if="visible">
    <!-- 对话框内容 -->
  </div>
</template>

<script>
  export default {
    emits: ['update:visible'],
    props: {
      visible: {
        type: Boolean,
        required: true
      }
    }
    // ...
  }
</script>

当 `ChildComponent` 中的 `visible` 发生变化时，可以通过 `$emit('update:visible', value)` 发出 `update:visible` 事件，从而将 `visible` 的变化通知给父组件。父组件在接收到 `update:visible` 事件后，可以将 `dialogVisible` 的值更新为新的值。