提交 | 用户 | 时间
|
820397
|
1 |
<!-- 标签选项 --> |
H |
2 |
<template> |
|
3 |
<div class="flex flex-wrap gap-[8px]"> |
|
4 |
<span |
|
5 |
v-for="tag in props.tags" |
|
6 |
:key="tag.value" |
|
7 |
class="tag mb-2 border-[2px] border-solid border-[#DDDFE3] px-2 leading-6 text-[12px] bg-[#DDDFE3] rounded-[4px] cursor-pointer" |
|
8 |
:class="modelValue === tag.value && '!border-[#846af7] text-[#846af7]'" |
|
9 |
@click="emits('update:modelValue', tag.value)" |
|
10 |
> |
|
11 |
{{ tag.label }} |
|
12 |
</span> |
|
13 |
</div> |
|
14 |
</template> |
|
15 |
|
|
16 |
<script setup lang="ts"> |
|
17 |
const props = withDefaults( |
|
18 |
defineProps<{ |
|
19 |
tags: { label: string; value: string }[] |
|
20 |
modelValue: string |
|
21 |
[k: string]: any |
|
22 |
}>(), |
|
23 |
{ |
|
24 |
tags: () => [] |
|
25 |
} |
|
26 |
) |
|
27 |
|
|
28 |
const emits = defineEmits<{ |
|
29 |
(e: 'update:modelValue', value: string): void |
|
30 |
}>() |
|
31 |
</script> |
|
32 |
<style scoped></style> |