a-date-picker（Ant Design 的日期选择器）有许多常用的属性和方法，用于配置功能、样式和交互逻辑。以下是一些高频使用的属性和方法分类整理：
一、核心配置属性
-
v-model / value
- 绑定选中的日期值，格式由
value-format 决定（默认是 dayjs 对象，设置 value-format 后为字符串）。 - 示例：
v-model="dateValue"
-
format
- 控制日期在输入框中的显示格式（如
YYYY-MM-DD、YYYY年MM月DD日）。 - 示例：
format="YYYY年MM月"
-
value-format
- 控制
v-model 绑定值的格式（字符串格式，如 YYYYMMDD、X 表示时间戳）。 - 示例：
value-format="YYYYMM"（月份选择器常用）
-
picker
- 指定选择器类型，可选值：
date（默认，日期）、week（周）、month（月）、quarter（季度）、year（年）。 - 示例：
picker="month"（月份选择器）
-
placeholder
- 输入框的占位文本。
- 示例：
placeholder="请选择日期"
-
allow-clear
- 是否允许清空选中的日期，默认
true。 - 示例：
allow-clear="false"（禁止清空）
二、禁用与限制相关
-
disabled
- 完全禁用选择器（整个组件置灰，无法交互）。
- 示例：
disabled="true"
-
disabled-date
- 自定义禁用日期的函数，返回
true 表示该日期禁用。 - 示例：禁用今天之后的日期（见前文）。
-
disabled-time
- （仅日期时间选择器，
show-time 为 true 时生效）自定义禁用的时间。 - 示例：禁用当天 18:00 之后的时间。
-
range
- （范围选择器
a-range-picker 专用）限制日期范围的跨度（如最多选择 7 天）。 - 示例：
range="7d"（最多选择 7 天）
三、样式与交互
-
size
- 控制组件大小，可选值：
large、middle（默认）、small。 - 示例：
size="small"
-
style / class
- 自定义组件样式（
style 为行内样式，class 为 CSS 类名）。 - 示例：
style="{ width: '200px' }"
-
placeholder
- 输入框占位文本，范围选择器可传数组（如
['开始日期', '结束日期']）。
-
show-time
- 是否显示时间选择器（将日期选择器变为“日期时间选择器”）。
- 示例：
show-time（默认时间格式，或传入 { format: 'HH:mm' } 自定义）
-
popup-style
- 自定义弹出面板的样式（如调整位置、背景色）。
- 示例：
popup-style="{ marginTop: '5px' }"
四、事件（方法）
-
@change
- 选中日期变化时触发，回调参数为选中的日期值（格式由
value-format 决定）。 - 示例：
@change="handleDateChange"
-
@openChange
- 弹出面板打开/关闭时触发，回调参数为
true（打开）或 false（关闭）。 - 示例：
@openChange="isOpen => console.log('面板状态：', isOpen)"
-
@focus / @blur
- 输入框获取焦点/失去焦点时触发。
- 示例：
@focus="handleFocus"
-
@clear
- 点击清空按钮时触发（
allow-clear 为 true 时生效）。 - 示例：
@clear="handleClear"
五、其他实用属性
-
default-value
- 初始默认值（非受控模式，优先于
v-model 初始值，适合无需双向绑定的场景）。 - 示例：
default-value="20251001"
-
locale
- 国际化配置，可自定义星期、月份的显示文本（如中文、英文）。
- 示例：引入
zhCN 本地化配置（默认已支持中文）。
-
disabled-keyboard
- 是否禁用键盘操作（如箭头键选择日期），默认
false。 - 示例：
disabled-keyboard="true"
-
getPopupContainer
- 指定弹出面板的父容器（解决弹出层被遮挡的问题）。
- 示例：
getPopupContainer="() => document.body"
总结
常用属性集中在 值绑定（ v-model ）、格式控制（ format / value-format ）、类型（ picker ）、禁用逻辑（ disabled / disabled-date ） ，而事件则以 @change（值变化）和 @openChange（面板状态）最为常用。根据需求选择配置即可。
