uni-calendar的日历组件显示的标点只能显示一种颜色,并且标点的位置在右上角.而我们在项目中需要实现多种颜色标点的显示,并且标点要显示在日期的正下方.
改之后的效果图:
实现以上的效果我们需要对uni-calendar组件的源码进行修改就可以了,想让这个日历组件实现不同颜色的标点我这里有两种方法可以实现.
第一种:
首先我们先找到uni-calendar-item.vue 文件
这里是我们传给日历组件的info标点值.
weeks.extraInfo.info 就是我们传给日历组件的标点值.
第二种:
日历组件显示多个标点:
我们只需要给日历组件的状态传一个数组即可文章来源:https://www.toymoban.com/news/detail-521827.html
在 uni-calendar-item.vue中进行循环判断即可文章来源地址https://www.toymoban.com/news/detail-521827.html
到了这里,关于uni-calendar日历组件更改标点颜色和位置及多个标点显示的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!