更新记录

1.0.0(2025-07-10)

初始版本


平台兼容性

uni-app x(4.26)

Chrome Safari Android iOS 鸿蒙 微信小程序
- - - -

yzc-calendar-x

yzc-calendar-x 是一款可左右滑动上下收缩(月/周模式)的仿钉钉uniappx日历插件(请测试合适后再购买)

使用示例

<template>
    <view class="content">
        <!-- 日历 -->
        <YZCCalendarX
        ref="calendar"
        class="calendar"
        :showTopBar="true"
        :showLunarDate="true"
        :weekstart="7"
        minDateStr="2025-02-15"
        maxDateStr="2026-02-25"
        :signeddates="signeddates"
        background="#f9f9f9"
        noramlColor="black"
        topBarBottomColor="rgba(0, 0, 0, 0.15)"
        chooseTextColor="white"
        chooseBackgroundColor="#0157d8"
        todayTextColor="red"
        @chooseDate="choseDate"
        @yearMonthChanged="yearMonthChanged"
        >
        </YZCCalendarX>
    </view>
</template>

<script lang="uts">
    import YZCCalendarX from '@/uni_modules/yzc-calendar-x/components/yzc-calendar-x/yzc-calendar-x.uvue'
    export default {
        components: {
            YZCCalendarX
        },
        data() {
            return {
                yearMonth: '',
                weekIndx: 0,
                week: ['日', '一', '二', '三', '四', '五', '六'],
                signeddates:['2024-12-09', '2015-01-11'],
                currentDate: '',
                isTody: false
            }
        },
        computed: {
            currentWeek () {
                return '周' + this.week[this.weekIndx]
            }
        },
        methods: {
           choseDate(date: string, isTody: boolean, weekIndex: number) {
              this.currentDate = date
              this.isTody = isTody
              this.weekIndx = weekIndex
              console.log('选中日期', date, isTody, this.currentWeek)
           },
           yearMonthChanged(yearMonth: string) {
              this.yearMonth = yearMonth
           }
        }
    }
</script>

<style lang="scss">
    .content {
        width: 100%;
        height: 100%;
        .calendar {
            width: 100%;
        }
    }
</style>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问