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

转载于:https://download.csdn.net/download/qq_40591925/11489494
小程序极点日历插件的使用
1.小程序后台添加插件
首先在微信小程序后台——设置——第三方服务,按AppID搜索到该插件并申请授权。

插件AppID:wx92c68dae5a8bb046

在这里插入图片描述
在这里插入图片描述
2.相关配置
app.json里
引入插件声明(和window同级)

 "plugins": {
    "calendar": {
      "version": "1.1.3",
      "provider": "wx92c68dae5a8bb046"
    }
  }

配置:我是写在app.json里的,也和window同级。好像也可以写在需要使用该插件的小程序页面中(没试过)

"usingComponents": {
    "calendar":"plugin://calendar/calendar"
  },
 

3.插件的使用

<calendar
  show-more-days='{{true}}'
   start-date="2018-01"
   end-date="2099-12"
   days-color="{{color}}"
   weeks-type="cn"
   binddayClick="dayClick"
   next='{{false}}'
   prev='{{false}}'
   lunar='{{true}}' //是否显示农历:只在开发工具上有问题报undefined,客户端上显示正常
   />

需要注意的是,引入日历插件只需要用单标签就行了啊,不用写双标签哦
app.js里

data:{
	color:[
      {
        month:'prev',//要标记的日期所属月份,有效值有prev(上个月),current(当前月),next(下个月)
        day:"31",//要标记的日期
        color:'white',//日期文字的颜色,格式为“#HEX”或CSS颜色名
        background:"pink",//日期单元格的颜色,格式为“#HEX”或CSS颜色名
      },{
        month:'current',
        day:"05",
        color:'white',
        background:"skyblue",
      },
    ]
    }

然后也还有其他的很多配置,如图:
在这里插入图片描述
某一天的操作事件

dayClick(e){
    console.log("点击日历的某一天:",e)
  }

猜你喜欢

转载自blog.csdn.net/xiaoma19941027/article/details/106840607