1、描述

提供下拉选择菜单，可以让用户在多个选项之间选择。

2、接口

Select(options:Array<SelectOption>)

3、SelectOption对象说明

参数名	参数类型	必填	描述
value	ResourceStr	是	下拉选项内容。
icon	ResourceStr	否	下拉选项图标。

4、属性

名称	参数类型	描述
selected	number	设置下拉菜单初始选项的索引，第一项的索引为0。当不设置selected属性时，默认选择值为-1，即菜单项不选中。
value	string	设置下拉按钮本身的文本内容。当菜单选中时默认会替换为菜单项文本内容。
font	Font	设置下拉按钮本身的文本样式。默认值：{size：‘16fp’,weight：FontWeight.Medium}
fontColor	ResourceColor	设置下拉按钮本身的文本颜色。默认值：‘#E6FFFFFF’
selectedOptionBgColor	ResourceColor	设置下拉菜单选中项的背景颜色。默认值：‘#33007DFF’
selectedOptionFont	Font	设置下拉菜单选中项的文本样式。默认值：{size：‘16fp’,weight：FontWeight.Regular}
selectedOptionFontColor	ResourceColor	设置下拉菜单选中项的文本颜色。默认值：‘ff007dff’。
optionBgColor	ResourceColor	设置下拉菜单项的背景颜色。默认值：‘ffffffff’。
optionFont	Font	设置下拉菜单项的文本样式。默认值：{size：‘16fp’,weight：FontWeight.Regular}
optionFontColor	ResourceColor	设置下拉菜单项的文本颜色。默认值：‘ff182431’。

5、事件

名称：onSelect(callback:(index:number, value?:string) => void)

功能描述：下拉菜单选中某一项的回调。index：选中项的索引；value：选中项的值。

6、示例

import router from '@ohos.router'@Entry
@Component
struct SelectPage {@State message: string = '提供下拉选择菜单，可以让用户在多个选项之间选择。'@State selectList: Array<SelectOption> = [{value: "Android",icon: $r('app.media.icon')},{value: "Java",icon: $r('app.media.icon')},{value: "Python"},{value: "HarmonyOS"},]build() {Row() {Scroll() {Column() {Text(this.message).fontSize(20).fontWeight(FontWeight.Bold).width("96%")Select(this.selectList).value("请选择您的职业？").font({ size: 18, weight: FontWeight.Bold }).fontColor("#FF00FF").selectedOptionBgColor(Color.Blue).selectedOptionFontColor(Color.White).optionBgColor(Color.Yellow).optionFontColor(Color.Red).onSelect((index: number, value: string) => {console.log("select", "index = " + index);console.log("select", "value = " + value);})Button("Select文本文档").fontSize(20).backgroundColor('#007DFF').width('96%').onClick(() => {// 处理点击事件逻辑router.pushUrl({url: "pages/baseComponent/select/SelectDesc",})}).margin({ top: 20 })}.width('100%')}}.padding({ top: 12, bottom: 12 })}
}

7、效果图