日历组件WeCalendar;支持折叠周模式;滑动;自定义标记 - WXOPEN Club

miniprogram-wecalendar

一个支持滑动、自定义折叠、标记日期、轻快的小程序日期组件
使用ESbuild 构建,现在的快速响应的

npm i miniprogram-wecalendar

yarn add miniprogram-wecalendar

在使用地方 page.json 或者 app.json 中使用 👇🏻

{
  "usingComponents": {
    "WeCalendar": "miniprogram-wecalendar"
  }
}

<WeCalendar markCalendarList="{{markCalendarList}}" isToday="{{true}}" bind:onRangeDate="onRangeDate" bind:onSelect="onSelect" />

Property	Type	Default	Description
isToday	Boolean	False	是否展示今天俺妞icon
markCalendarList	`Array[{ date: YYYY-MM-DD pointColor: #ccc }]`	[]	标记日历的数组,支持自定义颜色
defaultDate	String: YYYY-MM-DD	Null	默认时间
showFolding	Boolean	True	日历折叠功能
weeekLayer	Number	1	日历折叠的等级 \| 行数

Property	Type	Description
onSelect	Function Callback	日历每天的点击事件
onRangeDate	Function Callback	日历渲染的日期范围

onSelect: (e) => {
  const {day} = e.detail
  // ...
}

onRangeDate: (e) => {
  const {beginTime, endTime} = e.detail
  // ...
}

npm run dev