作者：蔡炜桀

在开发小程序的过程中，往往会遇到类似签到、打卡、记事、待办、提醒等相关主题的需求。而这类需求往往与时间强相关，且时间粒度往往是在「天」上，这就需要有一个组件来呈现以天为单位的展示需求，于是我们自然而然地想到了「日历」。

日历具有通用性、一次开发免维护、无需运营、无需网络连接、无需用户授权等优点，满足小程序插件「轻巧普适」的要求，很适合开发实现。

「极点日历」小程序插件各部分属性如下图：

插件配置

目前「极点日历」插件信息：

AppID

wx92c68dae5a8bb046

版本号

1.1.0

那么具体如何操作呢？下面为大家简单介绍一下：

1. 搜索插件

在微信小程序管理后台——设置——第三方服务，按 AppID（wx92c68dae5a8bb046）搜索到该插件并申请授权。

2. 引入声明

在要使用该插件的小程序 app.json 文件中引入插件声明。

3. 添加配置

在需要使用到该插件的小程序页面的 JSON 配置文件中，做以下配置：

4. 嵌入插件

在相应的 HTML 页面中添加以下语句即可完成插件的嵌入。

添加插件后效果如图：

默认用法，将具备以下样式特点：

以上样式均可参考 GitHub 属性文档更改。

自定义插件样式

日历插件本身是无背景色（透明）的，日历标题和周标题字体颜色默认为黑色加粗，当月日期默认字体颜色为 #4a4f74，非当前月日期字体颜色为 #c3c6d1。我们通过一个例子来说明如何自定义插件的样式。

1. 修改日历背景颜色

calendar-style 样式位插组件的根节点。假设要更改日历的背景色，除了插件件的父级容器设置背景色外，也可以通过该样式类进行配置来达到相应的效果。

首先在 WXML 文件里指定 calendar-style 的外部样式类为 calendar：

在 WXSS 文件新增 background-color 属性更改背景颜等，效果如下图。：

2. 修改日历标题样式

header-style 样式类位于组件的日历标题。对该组件进行配置，可以改变当前年月，上下月按钮的外观和背景。

在上面例子的基础上，我们在 WXML 文件中新增代码：

在 WXSS 文件中添加 header 样式：

3. 修改日历主面板

board-style 样式类位于日历组件的主面板，包含了周标题和日期部分。对该组件进行配置，可以改变周标题的样式和日期面板的样式。

紧跟上面的例子，我们对 WXML 文件加多一行代码。

在 WXSS 文件中新增 board 样式

效果如下：

4. 禁用上下月按钮，显示更多的日期

在 WXML 文件中，加入以下配置，可以使日历不能翻页，同时将次月的日期也显示出来。

5. 添加日期样式

日期的样式，可以通过对属性 days-color 进行配置，在 JS 文件中，添加以下数组，对日期样式进行定义。