20 lines
834 B
Vue
20 lines
834 B
Vue
<script setup lang="ts">
|
||
// 声明式:默认插槽里写 G3DropdownItem(不渲染 DOM,只作为数据载体被收集)
|
||
import { G3Button, G3Dropdown, G3DropdownItem, G3Message } from '@g3soft/ui'
|
||
import { Copy, Pencil, Trash2 } from '@lucide/vue'
|
||
</script>
|
||
|
||
<template>
|
||
<G3Dropdown @click="(payload: { key?: string | number }) => G3Message.info(String(payload.key))">
|
||
<!-- #trigger 显式指定触发器,避免和菜单项混在默认插槽里 -->
|
||
<template #trigger>
|
||
<G3Button type="outline">声明式菜单</G3Button>
|
||
</template>
|
||
|
||
<G3DropdownItem item-key="edit" label="编辑" :icon="Pencil" />
|
||
<G3DropdownItem item-key="copy" label="复制" :icon="Copy" />
|
||
<G3DropdownItem divider />
|
||
<G3DropdownItem item-key="delete" label="删除" :icon="Trash2" danger />
|
||
</G3Dropdown>
|
||
</template>
|