v-Form中选择日期自动填充输入框

先放效果图:

由于并没有搜到相关信息,尝试了很多次摸索出来这种方法,有可能还有更好的方案

1、表单设置中找到onFormDataChange事件

2、代码

日期选择器id绑定为:“date”,文本框id为“day”

  // 将日期字符串转换为 Date 对象
  const startDate = new Date(formModel.date[0]);
  const endDate = new Date(formModel.date[1]);
  // 计算两个日期之间的天数差
  const diffTime = endDate.getTime() - startDate.getTime();
  const diffDays = diffTime / (1000 * 60 * 60 * 24);
  // console.log(fieldName)
  // console.log(subFormData)
  // console.log(this.getFormData())
  // console.log(this.formData)
  // console.log(this.getSubFormValues())
  // console.log(this.getWidgetRef('date'))
  // console.log(this.getWidgetRef('day'))
  if (fieldName == 'date') {
    // 将计算结果赋值给 day
    // formModel.day = diffDays.toString();
    // console.log(diffDays.toFixed(1));
    formModel.day = diffDays.toFixed(1);
    this.setFormData(formModel);
  }

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值