京麦 Wot Design 组件中Calendar 日历选择器的使用
1、遇到的问题日历模板默认可选择范围当前日期的前6个月和后6个月
2、解决办法:设置min-date和max-date属性
<template>
<div>
<wd-datetime-picker type="date" v-model="value" label="日期选择" :minDate="minDate" :maxDate="maxDate"></wd-datetime-picker>
</div>
</template>
<script>
export default {
name: "demo",
data() {
return {
value: new Date(),
minDate: new Date(1990,1,1), //日期可选最小值
maxDate: new Date(2030,1,1), //日期可选最大值
}
}
}
3、可能遇到的问题,时间跨度太大在app里加载慢;备选方案使用DatetimePicker 日期时间选择器
<template>
<div>
<wd-datetime-picker type="date" v-model="value" label="日期选择" :minDate="minDate" :maxDate="maxDate"></wd-datetime-picker>
</div>
</template>
<script>
export default {
name: "demo",
data() {
return {
value: new Date(),
minDate: new Date(1990,1,1), //日期可选最小值
maxDate: new Date(2030,1,1), //日期可选最大值
}
}
}