BUG:01:参数传递BUG

项目场景:

报表开发,打开页面,前端发起GET请求


问题描述

前端参数未传递到后台
在这里插入图片描述
在这里插入图片描述

<FormItem label="查询日期:" required="required" style="display: inline;width: 500px;margin-bottom:0px">
    <DatePicker v-model="datePick.startMonth"
                format="yyyy-MM"
                style="width:100px; margin-right: 5px"
                type="month"
                @on-change="startMonthChange"
                :clearable="false"
                :editable="false"
                transfer>
    </DatePicker>
    -
    <DatePicker v-model="datePick.endMonth"
                format="yyyy-MM"
                style="width:100px; margin-left: 5px"
                type="month"
                @on-change="endMonthChange"
                :clearable="false"
                :editable="false"
                transfer>
    </DatePicker>
</FormItem>
created() {
    this.getCurrentDate();
    this.datePick.startMonth = this.currentMonth;
    this.datePick.endMonth = this.currentMonth;
    this.doSearch();
  },
//时间校验
    startMonthChange(value) {
      if (this.datePick.endMonth !== '' && this.datePick.endMonth != null) {
        this.datePick.startMonth = value
        if (new Date(this.datePick.startMonth).getTime() <= new Date(this.datePick.endMonth).getTime()) {
          this.searchForm.startMonth = value
        } else {
          this.datePick.startMonth = null
          this.searchForm.startMonth = null
          if (value !== null && value !== '') {
            this.$Message.warning({content: "开始月份不能在结束月份之后", duration: 0.8})
          }
        }
      } else {
        this.searchForm.startMonth = value
      }
    },
    endMonthChange(value) {
      if (this.datePick.startMonth !== '' && this.datePick.startMonth != null) {
        this.datePick.endMonth = value
        if (new Date(this.datePick.startMonth).getTime() <= new Date(this.datePick.endMonth).getTime()) {
          this.searchForm.endMonth = value
        } else {
          this.datePick.endMonth = null
          this.searchForm.endMonth = null
          if (value != null && value !== '') {
            this.$Message.warning({content: "结束月份不能在开始月份前", duration: 0.8})
          }
        }
      } else {
        this.searchForm.endMonth = value
      }
    },
    //获取当前时间
    getCurrentDate() {
      const currentDate = new Date();
      // 获取当前年份和月份
      const currentYear = currentDate.getFullYear();
      const currentMonth = currentDate.getMonth() + 1; // 月份从0开始,所以要加1
      // 格式化月份,确保是两位数字
      const formatMonth = function (month) {
        return month < 10 ? '0' + month : '' + month;
      };
      // 更新数据属性
      this.currentMonth = currentYear + '-' + formatMonth(currentMonth);
    },

原因分析:

获取的当前日期只绑定到了日期选择组件上,初始表单提交时未进行日期校验,未将日期传送到后台

created() {
    this.getCurrentDate();
    this.datePick.startMonth = this.currentMonth;
    this.datePick.endMonth = this.currentMonth;
    this.doSearch();
  },

解决方案:

1、在前端发起请求之前,进行时间校验;
2、将获取的默认参数,绑定到要提交的表单组件上;

出于运行效率考虑,选择了第二种方法

created() {
    this.getCurrentDate();
    this.datePick.startMonth = this.currentMonth;
    this.datePick.endMonth = this.currentMonth;
    this.searchForm.startMonth = this.currentMonth;
    this.searchForm.endMonth = this.currentMonth;
    this.doSearch();
  },
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不语知心

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值