Ant Design Vue 日期选择器DatePicker传给后台日期参数格式问题

花了一个下午才解决,官方组件文档里面是没有处理方案说明的。
项目版本:Ant Design Vue 2.0.2
前端部分代码:

<template><a-modal:visible="visible":width="windowWidth":height="800":title="title":maskClosable="false"@ok="close"@cancel="close"cancelText="关闭"><a-col :md="6" :sm="8"><span style="color: red;width: 15px;float: left; margin-top: 5px;"></span><a-form-item label="被查询人出生日期" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}"><a-date-picker placeholder="请选择被查询人出生日期查询(必填)" v-model="queryParam.csrq"  /></a-form-item></a-col></a-modal></template>
<script>
import moment from "moment";
import 'moment/locale/zh-cn';
moment.locale('zh-cn');
export default {data () {return {moment,// 查询条件queryParam: {csrq:''},}},methods: {close () {this.cleandata();this.visible = false;}}}
}
</script>

前端点击选择日期后,点击提交按钮提交表单时,发现传给后台的日期参数格式有问题,跟前端显示的效果不一致
在这里插入图片描述
要么前端传之前处理,要么后端接收后处理。
我参考了https://blog.csdn.net/weixin_52691965/article/details/120769403在前端做处理。

处理后代码如下:

		<a-col :md="6" :sm="8"><span style="color: red;width: 15px;float: left; margin-top: 5px;"></span><a-form-item label="被查询人出生日期" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
<!--              <a-input placeholder="请输入被查询人出生日期yyyy-mm-dd查询(必填)" v-model="queryParam.csrq"></a-input>--><a-date-picker placeholder="请选择被查询人出生日期查询(必填)" v-model:value="birthDate" format="YYYY-MM-DD" @change="shijianobj" /></a-form-item></a-col>export default {data(){return{moment,birthDate:'',// 查询条件queryParam: {csrq:''},}},methods: {close () {this.cleandata();this.visible = false;},shijianobj(e){this.queryParam.csrq = moment(e._d).format("YYYY-MM-DD");}}
}

处理完后传到后端日期格式就是yyyy-MM-dd格式

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/105088.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Golang Gorm 一对多关系 关系表创建

一对多关系 我们先从一对多开始多表关系的学习因为一对多的关系生活中到处都是&#xff0c;例如&#xff1a; 老板与员工女神和添狗老师和学生班级与学生用户与文章 在创建的时候先将没有依赖的创建。表名称ID就是外键。外键要和关联的外键的数据类型要保持一致。 package ma…

创建和分析二维桁架和梁结构研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

最小二乘法,残差,线性模型-线性回归

目录 什么是最小二乘法 残差是什么意思 线性模型 线性回归 方法一&#xff1a;解析解法 代码实战&#xff1a; 方法二&#xff1a;数值解法 代码实战&#xff1a; 解析法&#xff08;最小二乘&#xff09;还是数值法&#xff08;梯度下降&#xff09;&#xff0c;如何…

Unity 之 Start 与Update 方法的区别

文章目录 当谈论Unity中的 Start和 Update方法时&#xff0c;我们实际上是在讨论MonoBehaviour类中的两个常用方法&#xff0c;用于编写游戏逻辑。这两个方法在不同的时机被调用&#xff0c;因此您可以根据需要选择在哪个方法中编写特定的代码。 Start 方法&#xff1a; Start…

23款奔驰GLS450升级原厂电动吸合门,体验绅士的关门状态

电吸门的工作原理是在门框(或门板边缘)上安装一个电磁线圈。当门打开时&#xff0c;电流会流过线圈&#xff0c;形成电磁场。这样&#xff0c;由于磁力的作用&#xff0c;当门靠近门框关闭时&#xff0c;门会自动关闭。 另外&#xff0c;电吸门也有有用的一面。如果下车&#…

在线ppt转pdf如何转换?用这一个方法就够了

在线PPT转PDF是一种将PPT文件转换为PDF格式的便捷且常用的工具。随着科技的发展&#xff0c;PPT已经成为了商务、教育等领域中最常用的演示工具之一。PDF格式具有较好的稳定性和兼容性。PPT文件可能因为不同的操作系统、软件版本或字体缺失等原因而导致显示不一致或乱码等问题&…

计算机竞赛 基于CNN实现谣言检测 - python 深度学习 机器学习

文章目录 1 前言1.1 背景 2 数据集3 实现过程4 CNN网络实现5 模型训练部分6 模型评估7 预测结果8 最后 1 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 基于CNN实现谣言检测 该项目较为新颖&#xff0c;适合作为竞赛课题方向&#xff0c;学长非常推荐&am…

自动化测试之Selenium

自动化测试Selenium介绍环境搭建如何操作浏览器定位元素css类选择器定位元素xpath定位元素css选择语法xpath选择语法 常用操作添加等待打印信息浏览器更多操作键盘事件鼠标事件特殊场景只选复选框iframe标签下拉框处理弹窗显示上传文件 关闭浏览器切换窗口截图 自动化测试 自动…

一个程序员的工作日记--每天就干两件事,一年后让别人刮目相看

文章目录 成功源于专注一、早上布局二、晚上复盘三、技术细节四、专注与成功五、专注的重要性六、忙碌和赚钱七、结论以嵌入式开发为例&#xff1a;一、早上布局二、晚上复盘三、技术细节四、专注与成功五、忙碌和赚钱六、结论在嵌入式软件开发中&#xff0c;我们需要按照以下步…

elment-ui中使用el-steps案例

el-steps案例 样式 代码 <div class"active-box"><div class"active-title">请完善</div><el-steps :active"active" finish-status"success" align-center><el-step title"第一步" /><…

c语言练习题26:调整数组使奇数位于偶数前面

调整数组使奇数位于偶数前面 题目&#xff1a; 思路&#xff1a; 代码&#xff1a; #include<stdio.h> #include<string.h> void func(int* arr, int len) {int left 0;int right len - 1;while (left < right) {while (left < right && arr[lef…

【Vue框架】基本的login登录

前言 最近事情比较多&#xff0c;只能抽时间看了&#xff0c;放几天就把之前弄的都忘了&#xff0c;现在只挑着核心的部分看。现在铺垫了这么久&#xff0c;终于可以看前端最基本的登录了&#x1f602;。 1、views\login\index.vue 由于代码比较长&#xff0c;这里将vue和js…

7、Idea下载安装与激活

1、下载 1.1 官网地址 官网地址 https://www.jetbrains.com/idea/ 点击访问 1.2 官网首页 1.3 点击右上角dowload进入以下页面选择版本 1.4 选择需要的版本进行下载 2、安装

189. 轮转数组

189. 轮转数组 class Solution { public:void rotate(vector<int>& nums, int k) {int n nums.size();k k % n;reverse(nums.begin(),nums.end());reverse(nums.begin(),nums.begin()k);reverse(nums.begin()k,nums.end());} };

IDEA远程开发

IDEA远程开发 前期准备 IDEA的远程开发是在本地去操昨远程服务器上的代码&#xff0c;所以我们先需要准备一台服务器,在此我使用vmware虚拟出ubuntu-20.04.6的Server版本,以便后面演示。 Ubuntu的Java环境配置 JDK8 sudo apt install openjdk-8-jdkmaven sudo apt instal…

Java smslib包开发

上一篇文章我详细介绍RXTXcomm的安装方法和简单代码,如果小伙伴涉及到需要使用手机短信模块完成短信收发需求的话,可以使用到smslib进行开发。 首先还是同样的,将整个smslib包源码导入项目,并且将它所需依赖一起进行导入 导入完成之后,我们就可以对smslib包进行二次开发了 下面…

jQuery Editable Select可搜索下拉选项框

前言 可搜索的下拉选项框 源码地址:https://github.com/indrimuska/jquery-editable-select 可搜索的下拉选项框 引入依赖 <script src"//code.jquery.com/jquery-1.12.4.min.js"></script> <script src"//rawgithub.com/indrimuska/jquery…

线性代数的学习和整理9(草稿-----未完成)

矩阵的乘法的映射图(不属于本文) 矩阵的乘法具有不可交换性 A*B ! B*A A左乘*B ! A右乘*B 假设A!0, B!0, 但是可能存在 A*B0 假设A!0, 但是可能存在 A*A0 如果已知 A*BC&#xff0c;那么 B A-*C ,但是B ! C*A- 线性代数&#xff0c;矩阵&#xff0c;属于代数学&#xff0c;不属…

生成式 AI 在 Gartner 的 2023 年炒作周期中备受关注

原创 | 文 BFT机器人 01 背景 Gartner&#xff0c; Inc. 在其最新的 2023 年新兴技术炒作周期中&#xff0c;将生成人工智能(AI)定位于膨胀期望的顶峰&#xff0c;预计它将在未来两到五年内带来转型效益。这种人工智能变体是更广泛的新兴人工智能趋势的一部分&#xff0c;预示…

X2000 Linux PWM

一、硬件设计 PC04 ------------PWM4 二、通过shell开启PWM 配置参数 cmd_pwm config pc04 freq1000 max_level100 active_level1 accuracy_priorityfreq 启动 cmd_pwm set_level pc04 10 三、通过写程序控制 先用IConfigTool工具&#xff0c;使能libhardware2--->pwm…