導入
在使用日期選擇器前需要先引入momnet：
import moment from "moment";
import "moment/locale/zh-cn"
在引入后使用選擇器：
<a-date-picker
format="YYYY-MM-DD HH:mm:ss"
v-decorator="['time',{rules: [{ required: true, message: '請輸入時間!' }]}]"
:showTime="{ initialValue: moment('00:00:00', 'HH:mm:ss') }"
placeholder="請選擇時間"
@change="onChange"
@ok="onOk" />
這里的format 屬性，用於自定義日期顯示格式，我這里使用的是 2020-08-25，showTime是展示默認時間的，但是，嗯，我設置了好像沒什么用，可能有問題，可以給我留言，說一下這個是什么問題。。多謝。
獲取時間的方式
方式一：
在上述操作完成后，事件的添加：
methods: {
moment,
onChange (value, dateString) {
console.log('Selected Time: ', value)
console.log('Formatted Selected Time: ', dateString)
},
onOk (value) {
console.log('onOk: ', value)
},
}
這里可以獲取你需要的日期數據 dateString ，如下圖：
可以看到這里的dateString是你可以獲取得到的時間數據。
這個是獲取時間，通過v-model設置的話可以采用方式一獲取使用獲取。
方式二：
如果你表單內采用v-decorator進行數據綁定，也可以通過表單的方式獲取：
獲取到之后需要采用moment進行格式轉換
this.form.validateFields((err, values) => {
if (!err) {
console.log('Received values of form: ', values);
values.time = moment(values.time).format('YYYY-MM-DD HH:mm:ss')
}
})
這個time與我上述a-input標簽內的v-decorator綁定的數據一致。
這樣你可以拿到表單內time的數據並轉換格式。
在說完獲取數據后，再說一下日期選擇器設置數據吧
設置數據
如果你拿到個日期數據，后台返回的json數據，我拿到的為字符串，但是我直接設置不上去，是因為日期選擇器這里會報錯，我報錯沒截圖，但是記得這個會報需要拿到的是日期對象，而不能設置字符串。
所以，在設置數據前先對數據進行moment進行格式轉換
用法：在設置數據前先轉化要設置的時間格式：
this.form.setFieldsValue({
// "date": moment("自定義默認日期", 'YYYY-MM-DD')
“startTime": moment(this.startTime)
})
第一行是如果你格式不對時，添加后面的格式，正常就不需要添加后面的格式。
設置數據的核心就是這樣子，也可以其他方式實現。
后面的是為自己記錄：
昨天寫了表單設置值，方式二 內的東西：
this.form.resetFields();
this.model = Object.assign({}, this.record,{time: moment(this.record.time)});
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, ',name', 'age'))
});
給日期選擇框設置值，記錄一下。
————————————————
版權聲明：本文為CSDN博主「DOM曼珠沙華」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/a18792627168/article/details/108218444