1# Select 2 3提供下拉选择菜单，可以让用户在多个选项之间选择。 4 5> **说明：** 6> 7> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 8 9## 子组件 10 11无 12 13## 接口 14 15Select(options: Array\<[SelectOption](#selectoption对象说明)\>) 16 17## SelectOption对象说明 18 19| 参数名 | 参数类型 | 必填 | 参数描述 | 20| ------ | ----------------------------------- | ---- | -------------- | 21| value | [ResourceStr](ts-types.md#resourcestr) | 是 | 下拉选项内容。 | 22| icon | [ResourceStr](ts-types.md#resourcestr) | 否 | 下拉选项图片。 | 23 24## 属性 25 26| 名称 | 参数类型 | 描述 | 27| ----------------------- | ------------------------------------- | --------------------------------------------- | 28| selected | number | 设置下拉菜单初始选项的索引，第一项的索引为0。 | 29| value | string | 设置下拉按钮本身的文本内容。 | 30| font | [Font](ts-types.md#font) | 设置下拉按钮本身的文本样式。 | 31| fontColor | [ResourceColor](ts-types.md#resourcecolor) | 设置下拉按钮本身的文本颜色。 | 32| selectedOptionBgColor | [ResourceColor](ts-types.md#resourcecolor) | 设置下拉菜单选中项的背景色。 | 33| selectedOptionFont | [Font](ts-types.md#font) | 设置下拉菜单选中项的文本样式。 | 34| selectedOptionFontColor | [ResourceColor](ts-types.md#resourcecolor) | 设置下拉菜单选中项的文本颜色。 | 35| optionBgColor | [ResourceColor](ts-types.md#resourcecolor) | 设置下拉菜单项的背景色。 | 36| optionFont | [Font](ts-types.md#font) | 设置下拉菜单项的文本样式。 | 37| optionFontColor | [ResourceColor](ts-types.md#resourcecolor) | 设置下拉菜单项的文本颜色。 | 38 39## 事件 40 41| 名称 | 功能描述 | 42| ------------------------------------------------------------ | ------------------------------------------------------------ | 43| onSelect(callback: (index: number, value?: string) => void) | 下拉菜单选中某一项的回调。<br/>index：选中项的索引。<br/>value：选中项的值。 | 44 45## 示例 46 47```ts 48// xxx.ets 49@Entry 50@Component 51struct SelectExample { 52 build() { 53 Column() { 54 Select([{ value: 'aaa', icon: "/common/1.png" }, 55 { value: 'bbb', icon: "/common/2.png" }, 56 { value: 'ccc', icon: "/common/3.png" }, 57 { value: 'ddd', icon: "/common/4.png" }]) 58 .selected(2) 59 .value('TTT') 60 .font({ size: 30, weight: 400, family: 'serif', style: FontStyle.Normal }) 61 .selectedOptionFont({ size: 40, weight: 500, family: 'serif', style: FontStyle.Normal }) 62 .optionFont({ size: 30, weight: 400, family: 'serif', style: FontStyle.Normal }) 63 .onSelect((index: number) => { 64 console.info("Select:" + index) 65 }) 66 } 67 } 68} 69``` 70 71
