Ant Design Vue 时间选择框a-date-picker 表单处理

当我们使用Ant Design提供的时间选择框时，他默认在表单中的值是moment类型，就是使用moment()函数处理过的一串字符。

我这里的需求是，后端使用一个10位的int来存储时间戳，需要把这里默认的moment转成一个10位的数字来提交post请求。

这一步是编辑场景下选择器从时间戳转为moment

这里的mdl是这样，上面的代码是公共表单弹窗（modal）组件，mdl是将表单内的值传递进去的，在表单渲染发生前，就可以将时间戳提前转为moment。

  this.mdl.startTime = moment(this.mdl.startTime*1000)
  this.mdl.endTime = moment(this.mdl.endTime*1000)

---

 

  const form = this.$refs.createModal.form
  this.confirmLoading = true
  form.validateFields((errors, values) => {
    if (!errors) {
      values.cover = this.$refs.createModal.imageUrl
      values.startTime = parseInt(moment(values['startTime']).valueOf() / 1000)
      values.endTime = parseInt(moment(values['endTime']).valueOf() / 1000)
    }

这里是公共表单组件提交按钮的回调，通过validateFields验证完表单各字段规则后，准备提交前，我们将要提交的values中的时间字段，通过parseInt转为我们需要的字符串，如果你是存储13位的时间戳可以忽略掉后面的 / 1000。

ps:这篇文章是作者遇到这个需求时，使用战略合作伙伴百度没找到合适文章后，参考官方文档后发现的解决办法，希望能帮助到你！