vue如何向后台传递日期

2025-10-02 05:41:19

如何向后台传递日期

直接向后台传，会报错格式转化错误。

Cannot deserialize value of type `java.util.Date` from String "2020-02-26"

前台写法：

<el-form-item label="部署时间" prop="deployDate">
      <el-date-picker
              v-model="dataForm.deployDate"
              type="date"
              value-format="yyyy-MM-dd"
              format="yyyy-MM-dd"
              placeholder="选择日期">
        </el-date-picker>
    </el-form-item>

后台写法：

controller中直接实体接收，只需要在实体类中加入如下代码，进行格式化处理即可
/**
     * 部署时间
     */
    @JsonFormat(shape = JsonFormat.Shape.STRING, pattern="yyyy-MM-dd")
    private Date deployDate;

给后端发送日期格式

// 给后端发送日期格式
formatDateValue(now) {
	var year = this.dateZero(now.getFullYear()); //取得4位数的年份
	var month = this.dateZero(now.getMonth() + 1); //取得日期中的月份，其中0表示1月，11表示12月
	var date = this.dateZero(now.getDate()); //返回日期月份中的天数（1到31）
	var hour = this.dateZero(now.getHours()); //返回日期中的小时数（0到23）
	var minute = this.dateZero(now.getMinutes()); //返回日期中的分钟数（0到59）
	var second = this.dateZero(now.getSeconds()); //返回日期中的秒数（0到59）
	return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
},
// 日期前面加0
dateZero(time) {
	if (time < 10) {
		time = "" + "0" + time;
	}
	return time;
},
//需要发送的值
this.formatDateValue(new Date(this.appointmentTime))

以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

vue将后台数据时间戳转换成日期格式

前言在项目中,经常会有后台返回一个时间戳,页面展示用的却是日期格式的情况不同组件多次使用的话,那么建议在 src 下新建一个 common 文件夹,创建 date.js 文件,方便多次复用在组件中使用 <template> <div> <p>{{date1 | formatDate}}</p> <p>{{date1 | formatDate2}}</p> <p>{{date1 | formatDate3}}</
基于Vue组件化的日期联动选择器功能的实现代码

我们的社区前端工程用的是element组件库,后台管理系统用的是iview,组件库都很棒,但是日期.时间选择器没有那种" 年份 - 月份 -天数 " 联动选择的组件.虽然两个组件库给出的相关组件也很棒,但是有时候确实不是太好用,不太明白为什么很多组件库都抛弃了日期联动选择.因此考虑自己动手做一个. 将时间戳转换成日期格式 // timestamp 为时间戳 new Date(timestamp) //获取到时间标砖对象,如:Sun Sep 02 2018 00:00:00 GMT+08
Vue 使用formData方式向后台发送数据的实现

很多时候在使用form向后台发送数据的时候,并不需要使用到表单组件. 例如时间戳.ip等,这个时候除了ajax之外,还可以使用HTML5的一个全新方法FormData:在input[type = file]的文件类型中,很多时候想要把一张图片或者是使用canvas绘制好的图像传送到后台时,无法赋值给file文件,只能转换为base64类型传送到后台,然后由后台转换为图片再进行服务器存储:此过程较为复杂: 使用formdata,只需创建新的formdata对象,将要发送的数据添加进去,后台即可接收
vue如何向后台传递日期

目录如何向后台传递日期给后端发送日期格式如何向后台传递日期直接向后台传,会报错格式转化错误. Cannot deserialize value of type `java.util.Date` from String "2020-02-26" 前台写法: <el-form-item label="部署时间" prop="deployDate"> <el-date-picker v-
详解vue.js之props传递参数

本篇文章通过demo实例给大家详细分析了props传递参数的用法以及遇到问题后的解决办法,以下是全部内容. 前段时间用vue做一个后台管理系统,其中每一页都需要一个表格来展示信息.自然就想到了将表格提取出来做成公共组件,将不同页面的数据传入进行渲染,达到复用的目的. demo地址 1. 问题发现在父组件中,需要向表格组件传递的数据有表格的内容数据tableData,表格的页面数据page. <div> <my-table :table-data="tableData"
vue 中 get / delete 传递数组参数方法

在前后端交互的时候,有时候需要通过 get 或者 delete 传递一个数组给后台,但是这样直接传递后台无法接收数据,因为在传递的过程中数组参数会被转译,结果如下: 参数:{ name : [ 1, 2, 3 ] } 转译效果:http://aaa.com?name[]=1&name[]=2&name[]=3 目标效果:http://aaa.com?name=1&name=2&name=3 解决办法: 使用 qs 插件将数组参数序列化 1.qs.stringify({ a
vue.js管理后台table组件封装的方法

目录问题分析为什么封装封装的内容都有哪些封装table组件确认数据格式封装组件封装全局组件 table组件封装分页组件封装数据定义封装总结最近开了新的项目,简单说了自己的table封装. 问题分析为什么封装首先为什么封装,是因为追求技术吗,不,是因为懒,不想一直的去粘贴复制代码,所以就想把table封装下,可以在创建新的table的时候,只需要填充数据就行了. 封装的内容都有哪些主要有两个,一个是table组件,一个是分页组件搞清楚这个些,就可以开始封装组件了.
解决vue中el-date-picker type=daterange日期不回显的问题

目录 vue中el-date-picker type=daterange日期不回显原始代码问题发现及处理 el-date-picker 日期组件事件回显不生效日期组件回显处理本文说明 vue中el-date-picker type=daterange日期不回显原始代码 <el-form-item class="form_bigt_p" label="项目起止时间:" prop="time"> <el-date-pi
关于Ajax中通过response在后台传递数据问题

这是js代码: var System = { getHttpRequest: function(url, callback, options) { if (url.length < 0) return; var option = { url: url, type: "get", dataType: "json", cache: false, timeout: 30000, beforeSend: function(XHR) { }, complete: fun
jquery ajax 向后台传递数组参数示例

需求: 在JS中向后台传递数组参数分析: JS中的数组是弱类型的可以放任何类型(对象.基本类型),但是如果数组中放的是对象类型,传递到后台是显示的只能是对象字符串--[object Object],原因如下: 在后台接收的时候,只能用request来接收,request.getParameterValues()方法返回的是一个String[],所以,应该是在前台传输的时候调用了对象的toString()方法,那么如果依然想传递对象怎么办?凉拌! 但是可以使用JSON字符串来实现,在后台把JSO
JSP向后台传递参数的四种方式总结

Jsp页面传值的方法一.通过Form表单提交传值客户端通过Form表单提交到服务器端,服务器端通过 Java代码 request.getParameter(String xx); 来取得参数(xx)为参数名称. 通过get/post方式进行提交二.通过隐藏域传值通过在表单中加入一个隐藏域来提交到服务器端,这种方式的好处是可以在客户端加入一些自己想要加入的参数,以便得到相应的值. 客户端代码: Java代码 <input type="hidden" name="i
jQuery接受后台传递的List的实例详解

jQuery接受后台传递的List的实例详解后台代码: @RequestMapping(params = "getUser") @ResponseBody public List<User> getUser(){ List<User> list = new ArrayList<>(); return list; } 前台代码: $.ajax({ type: "POST", url: "${pageContext.req
详解vue嵌套路由-query传递参数

在嵌套路由中我们经常会遇到父路由向子路由里面传递参数,传递参数有两种方法,通过 query 或者 params index.html <div id="app">  <router-view></router-view> </div> main.js 同样通过重定向来显示父路由 import Vue from 'vue' import VueRo

vue如何向后台传递日期

目录

如何向后台传递日期

给后端发送日期格式

相关推荐

随机推荐