1# select 2 3>  **说明：** 4> 从API version 4开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 5 6下拉选择按钮，可让用户在多个选项之间选择。 7 8## 权限列表 9 10无 11 12 13## 子组件 14 15支持<[option](../arkui-js/js-components-basic-option.md)>。 16 17 18## 属性 19 20支持[通用属性](../arkui-js/js-components-common-attributes.md)。 21 22 23## 样式 24 25除支持[通用样式](../arkui-js/js-components-common-styles.md)外，还支持如下样式： 26 27| 名称 | 类型 | 默认值 | 必填 | 描述 | 28| -------- | -------- | -------- | -------- | -------- | 29| font-family | string | sans-serif | 否 | 字体列表，用逗号分隔，每个字体用字体名或者字体族名设置。列表中第一个系统中存在的或者通过[自定义字体](../arkui-js/js-components-common-customizing-font.md)指定的字体，会被选中作为文本的字体。 | 30 31 32## 事件 33 34除支持[通用事件](../arkui-js/js-components-common-events.md)外，还支持如下事件： 35 36| 名称 | 参数 | 描述 | 37| -------- | -------- | -------- | 38| change | {newValue: newValue} | 下拉选择新值后触发该事件，newValue的值为子组件option的value属性值。 | 39 40>  **说明：** 41> 42> - select组件不支持click事件。 43 44 45## 方法 46 47支持[通用方法](../arkui-js/js-components-common-methods.md)。 48 49 50## 示例 51 52``` 53<!-- xxx.hml --> 54<div class="container"> 55 <select @change="changeFruit"> 56 <option value="bananaValue"> 57 Banana 58 </option> 59 <option value="appleValue" selected="true"> 60 Apple 61 </option> 62 <option value="pearValue"> 63 Pear 64 </option> 65 </select> 66</div> 67``` 68 69``` 70/* xxx.css */ 71.container { 72 display: flex; 73 justify-content: center; 74 align-items: center; 75} 76``` 77 78 79
