Picker 选择器

选择器包含了单列选择器和多列选择器

示例

import { Header, ScrollView, TopView, Form, FormItem, Card, Divider, DividerGroup, PickerSelect, PickerMultiSelect } from '@/duxuiExample'

const selectorData = [1, 2, 3, 4, 5, 6, 7, 8, 9]

const selectorObjectData = [
  { name: '选项0', value: 0 },
  { name: '选项1', value: 1 },
  { name: '选项2', value: 2 },
  { name: '选项3', value: 3 },
  { name: '选项4', value: 4 },
  { name: '选项5', value: 5 },
  { name: '选项6', value: 6 },
  { name: '选项7', value: 7 }
]

const multiSelectorData = [selectorObjectData, selectorObjectData, selectorObjectData]

export default function PickerExample() {
  return <TopView>
    <Header title='Picker' />
    <Form onSubmit={console.log}>
      <ScrollView>
        <Card margin verticalPadding={false}>
          <DividerGroup>

            <FormItem label='单列选择' field='picker1'>
              <PickerSelect placeholder='请选择' range={selectorData} grow title='请选择' />
            </FormItem>

            <FormItem label='单列选择启用搜索' field='pickerSearch'>
              <PickerSelect placeholder='请选择' search range={selectorData} grow title='请选择' />
            </FormItem>

            <FormItem label='多列选择' field='picker2'>
              <PickerMultiSelect placeholder='请选择' range={multiSelectorData} grow title='请选择' />
            </FormItem>

            <FormItem label='单列选择对象数据' field='picker3'>
              <PickerSelect placeholder='请选择' range={selectorObjectData} grow title='请选择' />
            </FormItem>
          </DividerGroup>
        </Card>
      </ScrollView>
    </Form>
  </TopView>
}

PickerSelect Props

单列选择器

title

弹出选择器的标题

类型	必填	默认值
string	否

value

当前选中的值

类型	必填	默认值
string	否

defaultValue

默认值

类型	必填	默认值
string	否

range

选项范围

类型	必填	默认值
any[]	是

placeholder

提示文本

类型	必填	默认值
string	否	请选择

search

启用搜索功能

nameKey

选项对象中表示名称的键名

类型	必填	默认值
string	否	name

valueKey

选项对象中表示值的键名

类型	必填	默认值
string	否	value

onChange

值变化回调函数

类型	必填	默认值
(value: string) => void	否

modalFormProps

传递给modalForm的属性

类型	必填	默认值
ModalFormProps	否

PickerMultiSelect Props

多列选择器

title

弹出选择器的标题

类型	必填	默认值
string	否

value

当前选中的值

类型	必填	默认值
any[]	否

defaultValue

默认值

类型	必填	默认值
any[]	否

range

选项范围

类型	必填	默认值
any[][]	是

placeholder

提示文本

类型	必填	默认值
string	否	请选择

nameKey

选项对象中表示名称的键名

类型	必填	默认值
string	否	name

valueKey

选项对象中表示值的键名

类型	必填	默认值
string	否	value

onChange

值变化回调函数

类型	必填	默认值
(value: any[]) => void	否

modalFormProps

传递给modalForm的属性

类型	必填	默认值
ModalFormProps	否