COMPONENT 32 · Selection & Values

选择框

Select

也叫Select MenuPicker下拉选择框NSPopUpButton

打开原生选项列表，并从预定义集合中选择一个值。

Opens a native option list to choose one value from a predefined set.

ANATOMY & USAGE

结构与使用建议

组成部分

可见标签
当前值
选项列表

适合使用

选项稳定、不可自由输入且无需复杂搜索时。

不建议使用

用户需要输入自定义值、搜索大量选项或执行动作时。

键盘与无障碍

优先原生 select；标签关联明确，选项文字可区分，避免把不可用占位项当标签。

DESCRIBE IT TO AI

这样告诉编程助手

实现选择框（Select）：打开原生选项列表，并从预定义集合中选择一个值。

MINIMAL RUNNABLE CODE

可复制代码

原生与 React 两套实现，不依赖第三方组件库。

READ ONLY · SAFE TO COPY

<label class="demo stack" for="choice">
  <span>选择框</span>
  <select id="choice">
    <option>设计</option>
    <option>开发</option>
  </select>
</label>