跳到主要内容

PickerDate 日期选择

用于日期时间的选择

示例​

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

export default function DateExample() {
  return <TopView>
    <Header title='Date' />
    <Form onSubmit={console.log}>
      <ScrollView>
        <Card margin verticalPadding={false}>
          <DividerGroup>
            <FormItem label='日期' field='date'>
              <PickerDate title='日期' placeholder='请选择日期' grow />
            </FormItem>
            <FormItem label='年' field='year'>
              <PickerDate title='年' placeholder='请选择年' grow mode='year' />
            </FormItem>
            <FormItem label='月' field='month'>
              <PickerDate title='月' placeholder='请选择月' grow mode='month' />
            </FormItem>
            <FormItem label='日期时间' field='datetime'>
              <PickerDate title='日期时间' placeholder='请选择日期时间' grow mode='datetime' />
            </FormItem>
            <FormItem label='时间' field='time'>
              <PickerDate title='时间' placeholder='请选择时间' grow mode='time' />
            </FormItem>
          </DividerGroup>
        </Card>
      </ScrollView>
    </Form>
  </TopView>
}

PickerDate Props​

日期选择器

继承自 DatePickerProps

title​

弹出选择器的标题

类型必填默认值
string否

format​

时间格式 YYYY-MM-DD HH:mm:ss 从这个格式中组合

类型必填默认值
string否YYYY-MM-DD

timestamp​

传入的value是否已时间戳的形式存在，如果为false，将已 format 为准

类型必填默认值
boolean否false

mode​

Deprecated

此属性已弃用，使用 format 替代。

日期选择的模式

类型必填默认值
enum('datetime', 'date', 'time', 'month', 'year')否date

minDate​

最小时间

类型必填默认值
string否

maxDate​

最大时间

类型必填默认值
string否

disabled​

是否禁用

类型必填默认值
boolean否false

defaultValue​

默认值

类型必填默认值
string否

title​

弹出选择器的标题

类型必填默认值
string否

value​

当前选中的值

类型必填默认值
string否

defaultValue​

默认值

类型必填默认值
string否

placeholder​

提示文本

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

onChange​

值变化回调函数

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

modalFormProps​

传递给modalForm的属性

类型必填默认值
ModalFormProps否

use12Hours​

是否使用12小时制

类型必填默认值
boolean否false

locale​

本地话设置，其默认值如下，如需修改，需要配置完整内容

{
  year: '年',
  month: '月',
  day: '日',
  hour: '时',
  minute: '分',
  am: '上午',
  pm: '下午',
}
类型必填默认值
object否

style​

应用于日期选择器部分的样式

类型必填默认值
CSSProperties否