📅 小程序日历组件

概述

这是一款简单易用的小程序日历组件，实现了选择开始时间和结束时间的功能。克隆 maxrisk/calendar 之后可在微信开发者工具中打开查看示例。

项目地址：github.com/maxrisk/cal…

示例

index.wxml

<calendar least-days="{{ leastDays }}" bind:calendarchange="onCalendarChange" />

index.json

{
  "usingComponents": {
    "calendar": "/components/calendar/index"
  }
}

index.js

import { formatTime } from '../../utils/util.js';

Page({

  data: {
    leastDays: 3
  },

  onCalendarChange: function (e) {
    const startDate = new Date(e.detail.days[0]);
    const endDate = e.detail.days[1] ? new Date(e.detail.days[1]) : '';

    console.log(`选中 ${formatTime(startDate)} ~ ${endDate ? formatTime(endDate) : ''}，共 ${e.detail.count} 天`);
  }
})

组件属性

组件事件