Ant Design Vue日期选择器 使用v-decorator进行设置

目录

第一步

导入库

//设置中文
import locale from 'ant-design-vue/es/date-picker/locale/zh_CN'
import moment from 'moment'

使用

data(){
	return {
	    form: this.$form.createForm(this),
		mdoel: {formatDate:'2022-1-1',description:'Hello World'}
	}
}
a-date-picker
              style="width: 100%"
              :locale="locale"
              v-decorator="['formatDate', { rules: [{ required: true, message: '请选择日期' }] }]"
            />

第二步

设置值

在你的methods中或者watch中

this.form.setFieldsValue(this.model);
// 日期格式需要单独设置才有效果
this.$nextTick(() => {
        this.form.setFieldsValue({
        formatDate: moment(this.model.formatDate)
    })
})

效果

Ant Design Vue日期选择器 使用v-decorator进行设置_第1张图片

就能成功设置值了

你可能感兴趣的:(vue.js,javascript,前端)