AntDesignVue的a-range-picker根据自己需要设置默认日期
导入moment<script>import moment from 'moment';export default {data() {return {dateFormat: 'YYYY-MM-DD',};},methods: {moment,},};</script>设置defaultValue默认日期类型为momentHTML部分<a-range-picker c
·
示例图片
- 导入moment
<script>
import moment from 'moment';
export default {
data() {
return {
dateFormat: 'YYYY-MM-DD',
};
},
methods: {
moment,
},
};
</script>
- 设置defaultValue默认日期类型为moment
HTML部分
<a-range-picker class="range" @change="onChange"
showToday :default-value="[
moment(getCurrentDataL(), dateFormat),
moment(getCurrentDataR(), dateFormat),
]"
:format="dateFormat" />
js的method部分
methods: {
moment,//moment引入
//这里我的需求是默认展示十天前至昨天,其他的更改getday后的值即可
getCurrentDataL() {
return this.getDay(-10);
},
getCurrentDataR() {
// return new Date().toLocaleDateString();
return this.getDay(-1);
},
onChange(date, dateString) {
this.Bus.$emit("datePicker", dateString);
},
// 获取当前时间,day为number,getDay(-1):昨天的日期;getDay(0):今天的日期;getDay(1):明天的日期;【以此类推】
getDay(day) {
var today = new Date();
var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
today.setTime(targetday_milliseconds); //注意,这行是关键代码
var tYear = today.getFullYear();
var tMonth = today.getMonth();
var tDate = today.getDate();
tMonth = this.doHandleMonth(tMonth + 1);
tDate = this.doHandleMonth(tDate);
return tYear + "-" + tMonth + "-" + tDate;
},
// 处理月份数据
doHandleMonth(month) {
var m = month;
if (month.toString().length === 1) {
m = "0" + month;
}
return m;
},
},
页面展示时想要达到用户进入时已默认检索十天前至昨天的数据
添加create
created() {
this.value[0] = this.getDay(-10);
this.value[1] = this.getDay(0);
},
//另外需要在data中定义value
data() {
return {
value: [],
dateFormat: 'YYYY-MM-DD',
};
},
更多推荐
已为社区贡献2条内容
所有评论(0)