ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
## Calendar 日历 显示日期 ![](https://img.kancloud.cn/69/90/69904889dbf6f1ea99d1e222f64d9646_2086x966.png =600x) ### 代码示例 基础用法 ```html <cvu-calendar v-model="date" height="70"></cvu-calendar> ``` 自定义内容 >通过设置名为 cell 的 scoped-slot 来自定义日历单元格中显示的内容。 在 scoped-slot 可以获取到 date(当前单元格的日期),data{包括 date(完整日期)、year(年份)、month(月份)、day(天)、week(星期)、weekNumber(星期索引)、timeStamp(日期时间戳)、isToday(是否当前天)、monthType('prev':上月, 'current':当前月,'next':下月)} ![](https://img.kancloud.cn/58/6b/586b946bb3310d1717aa98926b7c67aa_2092x1114.png =600x) ```html <cvu-calendar> <template slot="cell" slot-scope="{date, data}"> <div style="font-size: 12px;">日期:{{ date }}</div> <div style="font-size: 12px;">星期:{{ data.week }}</div> </template> </cvu-calendar> ``` ### props | 属性 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | value | 绑定值 | Date/string/number | - | | height | 日历单元格高度 | Number/String | 100 | | border | 是否显示边框 | Boolean | true | | show-calendar-type | 是否显示年月日历类型切换开关 | Boolean | true | | show-month-type | 是否显示(上月/当月/下月)类型切换开关 | Boolean | true |