mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 12:14:41 +01:00
6da0db0113
Co-authored-by: Daniel Roe <daniel@roe.dev> Co-authored-by: Sébastien Chopin <seb@nuxt.com>
57 lines
970 B
Markdown
57 lines
970 B
Markdown
---
|
|
github: true
|
|
headlessui:
|
|
label: 'Menu'
|
|
to: 'https://headlessui.com/vue/menu'
|
|
---
|
|
|
|
## Usage
|
|
|
|
::component-example
|
|
#default
|
|
:dropdown-example
|
|
|
|
#code
|
|
```vue
|
|
<script setup>
|
|
const items = [
|
|
[{
|
|
label: 'Profile',
|
|
avatar: {
|
|
src: 'https://avatars.githubusercontent.com/u/739984?v=4'
|
|
}
|
|
}], [{
|
|
label: 'Edit',
|
|
icon: 'i-heroicons-pencil-square-20-solid'
|
|
}, {
|
|
label: 'Duplicate',
|
|
icon: 'i-heroicons-document-duplicate-20-solid'
|
|
}], [{
|
|
label: 'Archive',
|
|
icon: 'i-heroicons-archive-box-20-solid'
|
|
}, {
|
|
label: 'Move',
|
|
icon: 'i-heroicons-arrow-right-circle-20-solid'
|
|
}], [{
|
|
label: 'Delete',
|
|
icon: 'i-heroicons-trash-20-solid'
|
|
}]
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<UDropdown :items="items" :popper="{ placement: 'bottom-start' }">
|
|
<UButton color="white" label="Options" trailing-icon="i-heroicons-chevron-down-20-solid" />
|
|
</UDropdown>
|
|
</template>
|
|
```
|
|
::
|
|
|
|
## Props
|
|
|
|
:component-props
|
|
|
|
## Preset
|
|
|
|
:component-preset
|