<a-range-picker class="query-input" v-model="governmentForm.remark"/>
需求:后端返回的数据为“xxxx年xx月xx日~xxxx年xx月xx日”,现在需要将这个数据进行处理后返回给日期选择框组件进行回显。
处理思路:
1.日期区间范围选择框的数据源是一个数组,我们首先需要将该字符串拆分为数组。
let date = “xxxx年xx月xx日~xxxx年xx月xx日”;
let res = data.split('~');
//res = [ "xxxx年xx月xx日", "xxxx年xx月xx日"];
2.moment不支持xxxx年xx月xx日格式的转换,所以我们需要对数据的格式进行处理为xxxx-xx-xx
function getDate(val){
const time1 = val.split('年')[0];
const time2 = val.split('年')[1].split('月')[0];
const time3 = val.split('年')[1].split('月')[1].split('日')[0];
return `${time1}-${time2}-${time3}`
}
3.数据格式处理完成后调用moment方法即可
// 编辑--数据回显
update(value){
let res = value.remark.split('~');
this.governmentForm={...value,
remark:[moment(this.getDate(res[0])),moment(this.getDate[res[1]])]}
}