vue+element-ui 时间戳转换+表单验证
最近自己在做一个vue的项目，出现了一些问题，自己总结一下
时间格式处理
对于前端的时间格式转换,需要将时间戳的格式转换成格式发送给后端
使用了两种解决方式
一、使用方法
dateFormat: function(date) {
returns a string representing the year, month, and day in YYYY-MM-DD format.
计算年份为：" + String(date.getFullYear()) +
"年-" +
计算月份为：" + String(date.getMonth() > 0 ? date.getMonth() : 12) +
"月-" +
计算日期为：" + String(date.getDate()) +
"日";
}
+" " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds()
}
二、使用moment组件
下载 npm i moment -s
引入 import moment from "moment"
//把日历组件的数据进行转换
该字段的时间值被转换为指定的时间格式字符串
除此之外还有一些时间格式的处理，建议查看官方api
官方api Moment.js 中文网
三、当 backend 接收 specific time formats 时，在 Element UI 的 input 组件中无法显示。set the component's value format to "time format". 例如
给组件添加value-format属性，输入你想要的时间格式。
表单验证
对elemet-ui的表单验证进行了一些使用，过程如下。
在src目录中新增一个utils文件夹以存储工具类组件，并在其子目录中新增一个validate.js文件以便编写自定义的表单验证规则
接下来就是在要使用的组件中进行引入了
引入后在data中加入自己要使用到的验证规则
写好我们要的验证后，就是怎么在表单里使用了
在element元素的表单组件中添加:rules属性,其值设定为从data中定义好的rules字段用于执行规则验证,同时还需要设置ref属性用于获取DOM节点.该:rules属性会在用户提交表单内容时作为实参传递给处理方法以执行表格填写后的数据校验.完成这些设置后,为了确保后续操作顺利进行,请在需要验证的具体input元素上设置prop属性.需要注意的是,prop值不仅要与v-model绑定的表单字段名称保持一致,并且也必须与data中的:rules字段名完全一致,这样才能明确指定了采用了哪一种类型的校验规则.
上述三个属性分别是：必填 、验证使用的正则表达式 以及_提供提示信息的文本字段_ ，其中正则与文本信息均可以在validate.js文件中进行修改。
最后一步是给axios请求外包装一次表单验证操作。在处理点击提交或保存按钮事件时，请将之前定义好的ref值代入，并通过形参传递该值。如上所述
到此，element-ui 的表单验证就结束啦。