网站建设 回本,百度无锡营销中心,广州市设计院官网,铭讯网站建设elementUI的组件文档中没有详细说明typedates如何快捷选择一个时间段的日期#xff0c;我们可以通过picker-options参数来设置快捷选择#xff1a;
div classblockspan classdemonstration多个日期/spanel…elementUI的组件文档中没有详细说明typedates如何快捷选择一个时间段的日期我们可以通过picker-options参数来设置快捷选择
div classblockspan classdemonstration多个日期/spanel-date-pickertypedatesv-modelvalue4:picker-optionspickerOptionplaceholder选择一个或多个日期/el-date-picker/div
/div通过设置变量pickerOption的值可设置快捷选择
pickerOption:{shortcuts:[text:这半个月,onClick(picker){let end new Date();let start dateFormat(new Date(),-);end.setTime(end.getTime() 3600 * 1000 * 24 * 14);end dateFormat(end,-);let allDate getAllDate(start,end);picker.$emit(pick, [...allDate]);}]
}其中dateFormat方法是将日期格式化getAllDate方法是获取开始和结束日期之间的全部日期在data中定义
let dateFormat (time,h){let ymd ;let month (time.getMonth() 1 )10 ? (time.getMonth() 1) : (0 (time.getMonth() 1));let day time.getDate() 10? time.getDate() : (0 time.getDate());ymd time.getFullYear() h;ymd month h;ymd day;return ymd;
}let getAllDate(start,end){let allDateArr[];let startArr start.split(-);let endArr end.split(-);let db new Date();let db.setUTCFullYear(startArr[0[,startArr[1]-1,startArr[2]);let de new Date();de.setUTCFullYear(endArr[0[,endArr[1]-1,endArr[2]);let unixDb db.getTime();let unixDe de.getTime();let stamp;const oneDay 24*60*60*1000;for(stamp inixDb;stampunixDe;){allDateArr.push(dateFormat(new Date(parseInt(stamp)),-));stamp stamponeDay;}return allDateArr;
}
