28 lines
880 B
Vue
28 lines
880 B
Vue
<script setup lang="ts">
|
||
// 键盘：点击触发器后 ↑↓ 移动、Home/End 跳首尾、Enter 选中、Esc 关闭
|
||
import { ref } from 'vue'
|
||
import { G3Button, G3Dropdown, G3Message } from '@g3soft/ui'
|
||
|
||
const open = ref(false)
|
||
|
||
const items = [
|
||
{ key: 'view', label: '查看详情' },
|
||
{ key: 'download', label: '下载' },
|
||
{ key: 'rename', label: '重命名' },
|
||
{ key: 'move', label: '移动到…' },
|
||
]
|
||
</script>
|
||
|
||
<template>
|
||
<div style="display: flex; align-items: center; gap: 12px">
|
||
<G3Dropdown v-model:open="open" :items="items" placement="bottom-start">
|
||
<template #trigger>
|
||
<G3Button type="outline">按键盘操作</G3Button>
|
||
</template>
|
||
</G3Dropdown>
|
||
<span style="font-size: 12px; color: #6b7280">
|
||
菜单打开后按 ↑↓ / Enter 试试（当前 {{ open ? '已打开' : '已关闭' }}）
|
||
</span>
|
||
</div>
|
||
</template>
|