Select 选择器

类型定义

字段	类型	必选	描述
label	string	是	选项的显示文本（如“苹果”）。
value	string 或 number 或 boolean	是	选项的实际值（如 "apple"、1 或 true）。

---

Select 类型定义

export type Select = {
  options: SelectOption[];
  modelValue: SelectOption["value"];
};

字段说明

字段	类型	必选	描述
options	SelectOption[]	是	所有可选选项的列表。
modelValue	string 或 number 或 boolean	是	当前选中的值，必须与某个 option.value 匹配。

---

SelectOption 类型定义

type SelectOption = {
  label: string;
  value: string | number | boolean;
};

字段说明

示例

基本用法

const fruitSelect: Select = {
  options: [
    { label: "苹果", value: "apple" },
    { label: "香蕉", value: "banana" },
    { label: "橙子", value: "orange" },
  ],
  modelValue: "apple", // 默认选中“苹果”
};

数值型选项

const sizeSelect: Select = {
  options: [
    { label: "小号", value: 1 },
    { label: "中号", value: 2 },
    { label: "大号", value: 3 },
  ],
  modelValue: 2, // 默认选中“中号”
};

布尔型选项

const toggleSelect: Select = {
  options: [
    { label: "开启", value: true },
    { label: "关闭", value: false },
  ],
  modelValue: true, // 默认选中“开启”
};

---

注意事项

1. modelValue 的匹配
   • 必须与 options 中某一项的 value 严格相等（包括类型）。
2. 动态更新
   • 修改 modelValue 可切换选中状态，需确保值在 options 中存在。
3. 扩展性
   • 如需支持更多值类型（如对象），可扩展 SelectOption['value'] 的类型定义。