geniussheep/wx_calendar

微信小程序－日历 📅

小程序日历

思路分析

要实现一个简单的小程序日历，需要先知道几个值：

• 每月有多少天

• 每月第一天、最后一天各星期几

• 每月1号之前应有多少天属于上一个月

• 每月最后一天之后应有多少天属于下一个月

每月最多31天，最少28天。

引入组件

在页面 json 文件中配置组件

{
  "usingComponents": {
    "calendar": "../../component/calendar/index"
  }
}

在页面 wxml 中引入组件

<calendar calendarConfig="{{calendarConfig}}"></calendar>

自定义配置初始化日历

const conf = {
  data: {
    calendarConfig: {
      multi: true,
      defaultDay: '2019-5-19'
    }
  },
  doSomeThing() {
    this.calendar.enableArea(['2018-10-7', '2018-10-28']);
  }
};
Page(conf);

更多自定义配置及功能 请查阅日历文档

效果图