Combobox 组合框

带搜索的下拉选择，从选项列表中筛选并选中。另有 `EditableCombobox` 允许输入列表外的值。

何时使用

  • 需要可搜索、可自由输入的选择框时。
  • 选项较多、需要筛选过滤时。

基础用法

<script setup lang="ts">
import { ref } from "vue";
import { Combobox, type ComboboxOption } from "@reglow/reui";

const value = ref<string | number>();
const options: ComboboxOption[] = [
  { label: "苹果", value: "apple" },
  { label: "香蕉", value: "banana" },
  { label: "樱桃", value: "cherry" },
];
</script>

<template>
  <Combobox v-model="value" :options="options" />
</template>

导入

import { Combobox, EditableCombobox, type ComboboxOption } from "@reglow/reui";

Props

属性类型默认值说明
modelValuestring | number-选中值（v-model）
optionsComboboxOption[][]选项：{ label, value }
placeholderstring跟随语言占位文字
emptyTextstring跟随语言无匹配提示
disabledbooleanfalse禁用

国际化

placeholder、emptyText、搜索框占位等文案默认跟随全局语言（zh-CN / zh-TW / en-US），传 prop 可覆盖。

Checkbox 复选框
Checkbox 复选框
Command 命令面板
命令面板（Command Palette）基础组件，提供快速搜索并选择命令/操作的组合式 UI，常用于全局搜索、快捷键唤起等场景。