Kalendae使用总结

2019-03-06　16:50:18

git官方教程：https://github.com/Twipped/Kalendae

js、css:https://pan.baidu.com/s/1Ye-d09OMG_31E8NLqzGwDA        提取码：4v58

项目中需要用到能够显示多个日期的组件，查了好久，找到了Kalendae，当然其他的日期组件因为不了解，不代表不能实现。

 

使用方式：（日历绑定div）

　　1.html中引入js、css

　　2.<div id="datepk"></div>

　　3.js中初始化并设置参数：

　　　　

var kal= new Kalendae(document.getElementById("datepk"), {
　　　　　　months:1,
　　　　　　mode:'multiple',
　　　　　　subscribe: {
　　　　　　　　'date-clicked': function (date) {
　　　　　　　　　　//点击日期事件
　　　　　　　　},
　　　　　　　　'change': function(date){

　　　　　　　　　　//日期更改事件
　　　　　　　　},
　　　　　　　　'view-changed': function(date){

　　　　　　　　　　//界面更改事件
　　　　　　　   }

　　　　　　}
　　　　});

View Code

 

　　　　

　　　　注意，这里使用一个变量接收，可以在后期通过这个变量对日历进行动态操作，例如获取所有选中的日期：kal.getSelected();

 

　遇到的bug:

　　　　项目中需要动态显示跨好几个月的日期，当把这些日期动态的设置给日历时，出现了一种现象：

　　　　　

　　　　不是当前月份的日期也被选中了，苦恼了很久也没有从Kalendae根本上找到解决方式，最后我在view-changed添加了事件，每次变化都只查询当前年月的日期然后显示。

　　　　

 

转载于:https://www.cnblogs.com/know-more/p/10484247.html