@xwink/ui

    Select

    纯下拉选择控件。行为层(键盘导航、焦点、aria、dismiss、定位)交给 Reka UI,本组件只做样式层;标签、提示和校验统一交给 XField。

    不用原生 <select>:它的弹层由操作系统绘制,macOS / Windows 上的外观、行距、滚动条完全不同,且无法应用 token——同一套设计在两个平台上长得不一样。

    基础

    选项 label 缺省时展示 value 本身——编码型选项(服务商、币种)省一次重复书写;disabled 置灰不可选(「存在但当前不可用」比直接抹掉更有信息量):

    基础用法

    多选

    multiple 时 v-model 是数组,弹层与单选同一个,点选项切换勾选、弹层不收;clearable 的 × 一次清空:

    多选

    已选:mail

    API

    Props

    名称类型默认值说明
    optionsSelectOption[] | undefinedundefined—
    items(string | Record<string, unknown> | SelectOption)[] | undefinedundefined—
    itemLabelstring | undefined"label"—
    itemValuestring | undefined"value"—
    placeholderstring | undefinedundefined—
    disabledboolean | undefinedfalse—
    clearableboolean | undefinedfalse—
    multipleboolean | undefinedfalse—
    ariaLabelstring | undefinedundefined无障碍名称,用在没有可见 label 包裹的场景
    size"mini" | "small" | "medium" | "large" | "super" | undefinedundefined尺寸:mini / small / medium(默认) / large / super;不传则跟随环境 data-size
    variantFieldVariant | undefined——
    modelValueSelectValue | SelectValue[]——

    Emits

    事件载荷说明
    update:modelValue[value: SelectValue | SelectValue[]]—