这是个基于uni-app 符合uni_modules 的插件
仿Github/Gitee的贡献度热力图,不过只显示1个月(多了手机也放不下不是);
支持各种自定义,如模块整体尺寸、默认格子背景颜色、是否展示内容等;
<template>
<view>
<bwin-hot-calendar :dataList="list"></bwin-hot-calendar>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
date: '2022-5-6',
hot: 'little',
content: '√' // 非必传,同时需要配合showContent才能显示
}
]
}
}
}
</script>
| 参数名 | 类型 | 默认值 | 作用 | 注意事项 |
|---|---|---|---|---|
| width | String | 750rpx | 模块整体宽度,字号、边距等自动计算 | H5端请改用px |
| currentMonth | Number | 当前月份 | 传入后自动改变所有内容 | |
| emptyBgColor | String | #c1c1c1 | 上月末和下月初格子背景色 | 此部分格子不会显示热度 |
| fillBgColor | String | #eee | 本月所有格子初始背景色 | |
| showContent | Boolean | false | 是否在格子中展示内容 | |
| contentColor | String | #262626 | 格子内容的默认颜色 | |
| contentFontSize | String | 28rpx | 格子内容的字号 | |
| showWeek | Boolean | true | 是否展示周名称 | |
| showToday | Boolean | false | 是否着重显示今天 | |
| dataList | Array | [] | 传入格子的热度hot | 如果要显示内容则需要同时传入content |