更新记录
1.0.0(2026-02-02)
下载此版本
- 显示星期和日期网格
- 支持左右滑动切换月份
- 点击选择日期
- 自动高亮选中日期
平台兼容性
uni-app(5.0)
| Vue2 |
Vue3 |
Chrome |
Safari |
app-vue |
app-nvue |
Android |
iOS |
鸿蒙 |
| - |
√ |
√ |
- |
√ |
- |
- |
- |
- |
| 微信小程序 |
支付宝小程序 |
抖音小程序 |
百度小程序 |
快手小程序 |
京东小程序 |
鸿蒙元服务 |
QQ小程序 |
飞书小程序 |
小红书小程序 |
快应用-华为 |
快应用-联盟 |
| - |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- |
uni-app x(5.0)
| Chrome |
Safari |
Android |
iOS |
鸿蒙 |
微信小程序 |
| - |
- |
- |
- |
- |
- |
Calendar-Cop 日历组件
日历选择器组件,支持滑动切换月份和日期选择。
功能特性
- 显示星期和日期网格
- 支持左右滑动切换月份
- 点击选择日期
- 自动高亮选中日期
Props
| 属性名 |
类型 |
默认值 |
说明 |
| modelValue |
String |
"" |
默认选中的日期,格式:YYYY-MM-DD |
Events
| 事件名 |
参数 |
说明 |
| click |
String |
选择日期时触发,返回格式化日期字符串 |
使用示例
<template>
<Calendar-Cop v-model="selectedDate" @click="handleDateSelect" />
</template>
<script setup>
import { ref } from 'vue';
import CalendarCop from '@/components/Calendar-Cop.vue';
const selectedDate = ref('2024-01-15');
const handleDateSelect = (date) => {
console.log('选中的日期:', date);
};
</script>