[移动端] Calendar 组件 API 讨论

[LeeJim]

视觉稿：https://codesign.qq.com/s/JG2mj75B3G0VKdM/RMdGZQGRPma9Xk8/inspect

[xihangzhou]

日历组件如果只是仅作为一个弹窗选择器来选择日期的话并不算复杂，并且很多组件库都提供了这个支持。但是在实际的开发中有很多时候日历组件不仅是只有一个简单的点击交互，还有比如折叠，节假日，甚至农历排列等比较复杂的需求。如果将这些功能都集成在组件中那么整个组件就会变得非常的臃肿，如果不要这些功能那么对于开发者而言又只有从头开始进行日历组件的开发。于是我在想是不是可以对常用的日历排列逻辑进行封装，并且对用户提供更加灵活地处理的能力。于是小程序端的日历组件我将其设计成了一个支持插件化的组件。让用户可以对要展示的日期进行自定义化的开发。
如果不需要支持插件化，那么对用户提供每一个日期格子的自定义操作方法就十分必要，在小程序的日历组件中我也通过插槽提供给了用户对每一个格子自定义的能力。

[LeeJim]

插槽的方式可能在小程序上没法实现。每个插槽只能渲染一次。

[LeeJim]

不过，插件的方式确实不错，我觉得可以往这个方向做

[LeeJim]

目前视觉和交互都还比较简单，我写了初版的 API，欢迎在评论，可以持续优化。

Calendar Props

名称	类型	默认值	说明	必传
cell	Array / Function	-	日期单元。TS 类型：DateCellDescription[] ｜ ((data: Date) => string) interface DateCellDescription { date: Date; label: string; }。详细类型定义	N
confirm-btn	String / Function / Slot	-	确认按钮	N
first-day-of-week	Number	-	第一天从星期几开始，仅在日历展示维度为月份时（mode = month）有效。默认为 1。可选项：1/2/3/4/5/6/7	N
head	String / Slot	-	头部插槽（左上角处，默认不显示任何内容）	N
value	String / Date	-	当前高亮的日期。TS 类型：CalendarValue type CalendarValue = string ｜ Date。详细类型定义	N

Calendar Events

名称	参数	描述
cell-click	(options: { cell: CalendarCell;})	日历单元格点击时触发
confirm	(options: { value: Date;})	确认按钮点击时触发

[isanxia]

建议支持单选、多选、区间选择，还有可选范围。

[LeeJim]

感谢反馈，均已支持啦～