-
Notifications
You must be signed in to change notification settings - Fork 1
/
Dropdown.vue
54 lines (48 loc) · 1.25 KB
/
Dropdown.vue
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<template>
<div class="dropdown">
<slot name="dropdownToggle">
<Btn
class="dropdown-toggle"
data-bs-toggle="dropdown"
:size="size"
:variant="variant"
>
<slot>
Select
</slot>
</Btn>
</slot>
<DropdownMenu
:items="items"
:class="menuClass"
@click:item="clickItem($event)"
>
<template
v-for="slotName in menuSlots"
#[slotName]="slotScope"
>
<slot
:name="slotName"
v-bind="slotScope"
/>
</template>
</DropdownMenu>
</div>
</template>
<script lang="ts">
import Btn from '@/components/Button';
import DropdownMenu from '@/components/DropdownMenu';
import {Item} from '@/composables/useDropdownItems';
import {dropdownProps} from '@/composables/useDropdown';
</script>
<script lang="ts" setup>
defineProps(dropdownProps);
const emit = defineEmits(['click:item']);
const clickItem = (item: Item) => emit('click:item', item);
const menuSlots = [
'prepend',
'items',
'item',
'append',
];
</script>