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.mzph.cn/news/52468.shtml

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

相关文章

【C#学习笔记】匿名函数和lambda表达式

文章目录 匿名函数匿名函数的定义匿名函数作为参数传递匿名函数的缺点 lambda表达式什么是lambda表达式闭包 匿名函数 为什么我们要使用匿名函数&#xff1f;匿名函数存在的意义是为了简化一些函数的定义&#xff0c;特别是那些定义了之后只会被调用一次的函数&#xff0c;与其…

牛客:数对

题目&#xff1a; 解题思路&#xff1a;看到题目的时候&#xff0c;一般第1反应是用两个循环暴力解题&#xff0c;时间复杂度是O(n^2)&#xff0c;不能通过&#xff0c;所以要优化&#xff0c;通过找规律。 一、当 y < k 时&#xff0c; 不可能符合题意&#xff0c;所以 y 从…

Docker容器:dockerfile创建 LNMP 服务+Wordpress 网站平台

文章目录 一.环境及准备工作1.项目环境2.服务器环境3.任务需求 二.Linux 系统基础镜像三.docker构建Nginx1.建立工作目录上传安装包2.编写 Dockerfile 脚本3.准备 nginx.conf 配置文件4.生成镜像5.创建自定义网络6.启动镜像容器7.验证 nginx 四.docker构建Mysql1. 建立工作目录…

PySpark安装及WordCount实现(基于Ubuntu)

先盘点一下要安装哪些东西&#xff1a; VMwareubuntu 14.04&#xff08;64位&#xff09;Java环境&#xff08;JDK 1.8&#xff09;Hadoop 2.7.1Spark 2.4.0&#xff08;Local模式&#xff09;Pycharm &#xff08;一&#xff09;Ubuntu VMware 和 ubuntu 14.04&#xff08;…

【DETR】3、Conditional DETR | 拆分 content 和 spatial 来实现对 DETR 的加速

文章目录 一、Conditional DETR 是怎么被提出来的二、Conditional DETR 的具体实现2.1 框架结构2.2 DETR 的 cross-attention 和 Conditional DETR 的 cross-attention 对比 三、效果 论文&#xff1a;Conditional DETR for Fast Training Convergence 代码&#xff1a;https:…

爬虫逆向实战(二十)--某99网站登录

一、数据接口分析 主页地址&#xff1a;某99网站 1、抓包 通过抓包可以发现登录接口是AC_userlogin 2、判断是否有加密参数 请求参数是否加密&#xff1f; 通过查看“载荷”可以发现txtPassword和aws是加密参数 请求头是否加密&#xff1f; 无响应是否加密&#xff1f; 无…

Source Insight 宏-局部替换

编码中有没有遇到这种情况&#xff1a;添加一个新的函数&#xff0c;参考某某函数。然后我们新加一个函数名&#xff0c;把某某函数的内容全部拷贝过来&#xff0c;参数不一样时&#xff0c;再把拷贝过来的内容里的参数全部替换成新的参数。source insight 里替换的命令是ctrlh…

基于SSM的OA办公系统Java企业人事信息管理jsp源代码MySQL

本项目为前几天收费帮学妹做的一个项目&#xff0c;Java EE JSP项目&#xff0c;在工作环境中基本使用不到&#xff0c;但是很多学校把这个当作编程入门的项目来做&#xff0c;故分享出本项目供初学者参考。 一、项目描述 基于SSM的OA办公系统 系统有1权限&#xff1a;管理员…

深度丨Serverless + AIGC,一场围绕加速创新的升维布局

作者&#xff1a;褚杏娟 上图来源于基于函数计算部署 SD实现光影效果 前言&#xff1a; Serverless 在中国发展这些年&#xff0c;经历了高潮、低谷、现在重新回到大众视野。很多企业都非常感兴趣&#xff0c;部分企业开始大规模应用&#xff1b;也有一些企业对在生产环境真正…

RTSP/Onvif视频服务器EasyNVR安防视频云服务平台出现崩溃并重启的情况解决方案

EasyNVR安防视频云服务平台的特点是基于RTSP/Onvif协议将前端设备统一接入&#xff0c;在平台进行转码、直播、处理及分发&#xff0c;在安防监控场景中&#xff0c;EasyNVR可实现实时监控、云端录像、云存储、告警、级联等视频能力&#xff0c;极大满足行业的视频监控需求。 有…

网络安全入口设计模式

网络安全入口涵盖了几种设计模式&#xff0c;包括全局路由模式、全局卸载模式和健康终端监控模式。网络安全入口侧重于&#xff1a;全局路由、低延迟故障切换和在边缘处减轻攻击。 上图包含了3个需求。 •网络安全入口模式封装了全局路由模式。因此&#xff0c;实现可以将请求路…

2023年高教社杯数学建模思路 - 复盘:校园消费行为分析

文章目录 0 赛题思路1 赛题背景2 分析目标3 数据说明4 数据预处理5 数据分析5.1 食堂就餐行为分析5.2 学生消费行为分析 建模资料 0 赛题思路 &#xff08;赛题出来以后第一时间在CSDN分享&#xff09; https://blog.csdn.net/dc_sinor?typeblog 1 赛题背景 校园一卡通是集…

线性代数的学习和整理4: 求逆矩阵的多种方法汇总

目录 原始问题&#xff1a;如何求逆矩阵&#xff1f; 1 EXCEL里&#xff0c;直接可以用黑盒表内公式 minverse() 数组公式求A- 2 非线性代数方法&#xff1a;解方程组的方法 3 增广矩阵的方法 4 用行列式的方法计算&#xff08;未验证&#xff09; 5 A-1/|A|*A* &…

报名开启 | HarmonyOS第一课“营”在暑期系列直播

<HarmonyOS第一课>2023年再次启航&#xff01; 特邀HarmonyOS布道师云集华为开发者联盟直播间 聚焦HarmonyOS 4版本新特性 邀您一同学习赢好礼&#xff01; 你准备好了吗&#xff1f; ↓↓↓预约报名↓↓↓ 点击关注了解更多资讯&#xff0c;报名学习

用pytorch实现Resnet

ResNet&#xff08;Residual Network&#xff09;是一种深度卷积神经网络架构&#xff0c;由Kaiming He等人于2015年提出。它在计算机视觉领域引起了革命性的变革&#xff0c;使得训练更深的神经网络成为可能&#xff0c;超越了传统网络架构的限制。 ResNet的主要创新在于…

动态规划入门:斐波那契数列模型以及多状态(C++)

斐波那契数列模型以及多状态 动态规划简述斐波那契数列模型1.第 N 个泰波那契数&#xff08;简单&#xff09;2.三步问题&#xff08;简单&#xff09;3.使⽤最⼩花费爬楼梯&#xff08;简单&#xff09;4.解码方法&#xff08;中等&#xff09; 简单多状态1.打家劫舍&#xff…

Redis 重写 AOF 日志期间,主进程可以正常处理命令吗?

重写 AOF 日志的过程是怎样的&#xff1f; Redis 的重写 AOF 过程是由后台子进程 bgrewriteaof 来完成的&#xff0c;这么做有以下两个好处。 子进程进行 AOF 重写期间&#xff0c;主进程可以继续处理命令请求&#xff0c;从而避免阻塞主进程子进程带有主进程的数据副本。这里…

leetcode359周赛

2828. 判别首字母缩略词 核心思想:枚举。只需要枚举首字母和s是否一一对应即可。 2829. k-avoiding 数组的最小总和 核心思想&#xff1a;自己的方法就是哈希表&#xff0c;枚举i的时候&#xff0c;将k-i统计起来&#xff0c;如果出现了那么就跳过。灵神的方法是数学法&#…

OpenCV项目开发实战--基于Python/C++实现鼠标注释图像和轨迹栏来控制图像大小

鼠标指针是图形用户界面 (GUI) 中的关键组件。没有它,您就无法真正考虑与 GUI 进行交互。那么,让我们深入了解 OpenCV 中鼠标和轨迹栏的内置函数。我们将演示如何使用鼠标来注释图像,以及如何使用轨迹栏来控制图像的大小 我们将使用下图来演示 OpenCV 中鼠标指针和轨迹栏功能…

stm32之16.外设定时器——TIM3

----------- 源码 void tim3_init(void) {NVIC_InitTypeDef NVIC_InitStructure;TIM_TimeBaseInitTypeDef TIM_TimeBaseStructure;//使能TIM3的硬件时钟RCC_APB1PeriphClockCmd(RCC_APB1Periph_TIM3,ENABLE);//配置TIM3的定时时间TIM_TimeBaseStructure.TIM_Period 10000-1…