终于坑坑坑上了…
描述
这是一个基于vue的日期选择组件,支持按周和按月份显示(默认按周显示,下滑按月显示)。
安装
npm install vv-calendar -s
使用
属性
name | type | Value |
---|---|---|
type | string | month / week,分别代表显示周、月,和只显示周。 |
configDayData | array | 在某些天上需要加上的标识数据 |
事件
name | type | arguments | callback |
---|---|---|---|
selectDateChange | function | date | 返回当前选中的日期相关数据 |
import Vue from "vue";
import Calendar from "vv-calendar";
Vue.use(Calendar);
<Calendar
v-model="selectedDate"
:select-date-change="onSelectDateChange"
:config-day-data="calendarConfigDayData"
type="month"
/>
data() {
return {
selectedDate: new Date(),
calendarConfigDayData: [
{ date: 1586706786234, numberCount: 3 },
{ date: 1585842786000, numberCount: 1 },
{ date: 1586361186000, numberCount: 2 },
{ date: 1586351186000, numberCount: 216 }
],
};
},
methods: {
onSelectDateChange(date) {
this.selectedDate = date.date.timeString;
console.log(date);
console.log(this.selectedDate);
},
}
GitHub :稍等,还没上传~