1# 文本滑动选择器弹窗 2 3> **说明：** 4> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 5 6根据指定的选择范围创建文本选择器，展示在弹窗上。 7 8## 权限列表 9 10无 11 12## TextPickerDialog.show 13 14show(options: TextPickerDialogOptions) 15 16定义文本滑动选择器弹窗并弹出。 17 18- TextPickerDialogOptions参数 19 | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 20 | -------- | -------- | -------- | -------- | -------- | 21 | range | string[] | 是 | - | 选择器的数据选择范围。 | 22 | selected | number | 否 | 0 | 选中项在数组中的index值。 | 23 | value | string | 否 | 第一个元素值 | 选中项的值，优先级低于selected。 | 24 | defaultPickerItemHeight | number \| string | 否 | - | 默认Picker内容项元素高度。 | 25 | onAccept | (value: TextPickerResult) => void | 否 | - | 点击弹窗中确定按钮时触发。 | 26 | onCancel | () => void | 否 | - | 点击弹窗中取消按钮时触发。 | 27 | onChange | (value: TextPickerResult) => void | 否 | - | 滑动选择器，当前选择项改变时触发。 | 28 29- TextPickerResult对象说明 30 | 名称 | 参数类型 | 描述 | 31 | -------- | -------- | -------- | 32 | value | string | 选中项文本。 | 33 | index | number | 选中项在数组中的index值。 | 34 35## 示例 36 37```ts 38// xxx.ets 39@Entry 40@Component 41struct TextPickerDialogExample { 42 @State select: number = 1 43 private fruits: string[] = ['apple1', 'orange2', 'peach3', 'grape4'] 44 45 build() { 46 Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center, 47 justifyContent: FlexAlign.Center }) { 48 Button("TextPickerDialog").onClick(() => { 49 TextPickerDialog.show({ 50 range: this.fruits, 51 selected: this.select, 52 onAccept: (value: TextPickerResult) => { 53 console.info("TextPickerDialog:onAccept()" + JSON.stringify(value)) 54 this.select = value.index 55 }, 56 onCancel: () => { 57 console.info("TextPickerDialog:onCancel()") 58 }, 59 onChange: (value: TextPickerResult) => { 60 console.info("TextPickerDialog:onChange()" + JSON.stringify(value)) 61 } 62 }) 63 }) 64 } 65 } 66} 67``` 68