用途:为 Vue 3 应用集成 Syncfusion 的日历类 UI 组件,包括 Calendar(日历)、DatePicker(日期选择)、DateRangePicker(日期范围选择)、DateTimePicker(日期时间选择)和 TimePicker(时间选择)。
主要能力:Calendar 支持单选与多选、月/年/十年视图、导航、周数、禁用日期、自定义日期单元格渲染、本地化、RTL 与无障碍;DatePicker 提供输入框加下拉日历,支持格式化输入、键盘导航、范围约束、日期掩码与严格模式;DateRangePicker 支持起止日期绑定、范围校验、预设范围与格式化输出;DateTimePicker 合并日期与时间选择,支持 12/24 小时制、分钟/秒步进;TimePicker 为纯时间选择器,支持 12/24 小时制、步进与预设时间列表。
使用方式:安装命令为 npm install @syncfusion/ej2-vue-calendars @syncfusion/ej2-base。组件以 kebab-case 标签使用,如 ejs-calendar、ejs-datepicker、ejs-daterangepicker、ejs-datetimepicker、ejs-timepicker,并通过 @change 事件同步到 Vue ref。需按组件导入相应主题 CSS,例如 @syncfusion/ej2-base/styles/material3.css、@syncfusion/ej2-calendars/styles/material3.css,DatePicker 等还需导入 buttons、inputs、popups 样式。常用属性包括 :value、:min、:max、:format、:step、:placeholder、:readonly、:disabled、:weekNumber、:isMultiSelection、:values、:startDate、:endDate。
适用场景:表单日期/时间输入、日期范围筛选、多日期选择、需要本地化与无障碍支持的 Vue 3 界面。
限制:资料未提供收费、价格、平台兼容性与性能数据;Calendar 本身不含内置范围高亮,范围选择需使用 DateRangePicker;无障碍的 role 与 aria-live 需由外层元素实现,并非 Calendar 直接属性。