小程序日历插件-极点日历使用

1.
在微信小程序管理后台——设置——第三方服务，按 AppID（wx92c68dae5a8bb046）搜索到该插件并申请授权。
2.
在要使用该插件的小程序 app.json 文件中引入插件声明。
“plugins”: {
“calendar”: {
“version”: “1.1.0”,
“provider”: “wx92c68dae5a8bb046”
}
}
3.
在需要使用到该插件的小程序页面的 JSON 配置文件中，做以下配置：

{
“usingComponents”: {
“calendar”: “plugin://calendar/calendar”
}
}
4. 嵌入插件
在相应的 HTML 页面中添加以下语句即可完成插件的嵌入。
wxml

<calendar  calendar-style="calendar"  header-style="calendar-header"  board-style="calendar-board" days-color="{{dayStyle}}" weeks-type="cn" binddayClick="dayClick" />

wxss

/* pages/application/reissue/reissue.wxss */
.calendar {
  background-color:white; /*背景色为白色*/
  padding-top: 10px;    /*上内边距为10px*/
  color: #38ACFF;
  border-radius: 15px;   /*添加边框圆角*/
  border: 2rpx solid #38ACFF;
  -webkit-box-shadow:0 0 10px #38ACFF;
  -moz-box-shadow:0 0 10px #38ACFF;
  box-shadow:0 0 10px #38ACFF;

}

js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    dayStyle: [
      { month: 'current', day: new Date().getDate(), color: 'white', background: '#AAD4F5' }, 
      { month: 'current', day: new Date().getDate(), color: 'white', background: '#AAD4F5' }
    ],
  },
  //给点击的日期设置一个背景颜色
  dayClick: function (event) {
    let clickDay = event.detail.day;
    let changeDay = `dayStyle[1].day`;
    let changeBg = `dayStyle[1].background`;
    this.setData({
      [changeDay]: clickDay,
      [changeBg]: "#84e7d0"
    })

  },
  onLoad:function(){ }
})