# 弹窗 / 抽屉场景（Vue 3）

## Dialog / Modal

```vue
<script setup lang="ts">
import { ref } from 'vue'

const visible = ref(false)
</script>

<template>
  <w-button type="primary" @click="visible = true">打开</w-button>
  <w-dialog v-model="visible" title="标题" width="520px">
    <p>内容区</p>
    <template #footer>
      <w-button @click="visible = false">取消</w-button>
      <w-button type="primary" @click="visible = false">确定</w-button>
    </template>
  </w-dialog>
</template>
```

## Drawer

```vue
<w-drawer v-model="drawerVisible" title="详情" size="480px">
  <!-- 内容 -->
</w-drawer>
```

- 使用 `v-model` 控制显隐（非 `.sync`）
- 底部按钮放 `#footer` 插槽
- 删除确认优先 `w-popconfirm`，非弹窗套弹窗
