除了disabledDate，a-date-picker还有哪些常用的属性和方法？

a-date-picker（Ant Design 的日期选择器）有许多常用的属性和方法，用于配置功能、样式和交互逻辑。以下是一些高频使用的属性和方法分类整理：

一、核心配置属性

1. v-model / value
   • 绑定选中的日期值，格式由 value-format 决定（默认是 dayjs 对象，设置 value-format 后为字符串）。
   • 示例：v-model="dateValue"
2. format
   • 控制日期在输入框中的显示格式（如 YYYY-MM-DD、YYYY年MM月DD日）。
   • 示例：format="YYYY年MM月"
3. value-format
   • 控制 v-model 绑定值的格式（字符串格式，如 YYYYMMDD、X 表示时间戳）。
   • 示例：value-format="YYYYMM"（月份选择器常用）
4. picker
   • 指定选择器类型，可选值：date（默认，日期）、week（周）、month（月）、quarter（季度）、year（年）。
   • 示例：picker="month"（月份选择器）
5. placeholder
   • 输入框的占位文本。
   • 示例：placeholder="请选择日期"
6. allow-clear
   • 是否允许清空选中的日期，默认 true。
   • 示例：allow-clear="false"（禁止清空）

二、禁用与限制相关

1. disabled
   • 完全禁用选择器（整个组件置灰，无法交互）。
   • 示例：disabled="true"
2. disabled-date
   • 自定义禁用日期的函数，返回 true 表示该日期禁用。
   • 示例：禁用今天之后的日期（见前文）。
3. disabled-time
   • （仅日期时间选择器，show-time 为 true 时生效）自定义禁用的时间。
   • 示例：禁用当天 18:00 之后的时间。
4. range
   • （范围选择器 a-range-picker 专用）限制日期范围的跨度（如最多选择 7 天）。
   • 示例：range="7d"（最多选择 7 天）

三、样式与交互

1. size
   • 控制组件大小，可选值：large、middle（默认）、small。
   • 示例：size="small"
2. style / class
   • 自定义组件样式（style 为行内样式，class 为 CSS 类名）。
   • 示例：style="{ width: '200px' }"
3. placeholder
   • 输入框占位文本，范围选择器可传数组（如 ['开始日期', '结束日期']）。
4. show-time
   • 是否显示时间选择器（将日期选择器变为“日期时间选择器”）。
   • 示例：show-time（默认时间格式，或传入 { format: 'HH:mm' } 自定义）
5. popup-style
   • 自定义弹出面板的样式（如调整位置、背景色）。
   • 示例：popup-style="{ marginTop: '5px' }"

四、事件（方法）

1. @change
   • 选中日期变化时触发，回调参数为选中的日期值（格式由 value-format 决定）。
   • 示例：@change="handleDateChange"
2. @openChange
   • 弹出面板打开/关闭时触发，回调参数为 true（打开）或 false（关闭）。
   • 示例：@openChange="isOpen => console.log('面板状态：', isOpen)"
3. @focus / @blur
   • 输入框获取焦点/失去焦点时触发。
   • 示例：@focus="handleFocus"
4. @clear
   • 点击清空按钮时触发（allow-clear 为 true 时生效）。
   • 示例：@clear="handleClear"

五、其他实用属性

1. default-value
   • 初始默认值（非受控模式，优先于 v-model 初始值，适合无需双向绑定的场景）。
   • 示例：default-value="20251001"
2. locale
   • 国际化配置，可自定义星期、月份的显示文本（如中文、英文）。
   • 示例：引入 zhCN 本地化配置（默认已支持中文）。
3. disabled-keyboard
   • 是否禁用键盘操作（如箭头键选择日期），默认 false。
   • 示例：disabled-keyboard="true"
4. getPopupContainer
   • 指定弹出面板的父容器（解决弹出层被遮挡的问题）。
   • 示例：getPopupContainer="() => document.body"

总结

常用属性集中在 值绑定（v-model）、格式控制（format/value-format）、类型（picker）、禁用逻辑（disabled/disabled-date） ，而事件则以 @change（值变化）和 @openChange（面板状态）最为常用。根据需求选择配置即可。