vue里格式化时间的方法「如何在Vuejs中对时间格式化」

| 知乎：https://www.zhihu.com/people/1024-paper-96

| GitHub：https://github.com/JiangXia-1024?tab=repositories

| CSDN：https://blog.csdn.net/qq_41153943

| 掘金：https://juejin.cn/user/651387938290686

本文一共760字，阅读时长4分钟

在Vue.js中并没有对于时间的格式化方法。比如，新建一个Vue文件，然后在页面输出当前时间。

{{shijian}}

结果如下，这显然不是日常所见到的日期格式。

所以我们可以自定义时间过滤器对日期进行格式化。

不格式化的时间：{{shijian}}

格式化年月日的时间：          {{shijian|shijianfilter("yyy-mm-dd")}}

格式化精确到时分秒的时间：{{shijian|shijianfilter("yyy-mm-dd hh:mm:ss")}}

这时输出的结果是

注意到当时间为各位的时候只显示一位，比如9月，显示为9，与我们常见的”2019-09-12样式“不一样，在ES6中有两个函数padStart()和padEnd(),可以用来进行位数不全，语法格式为：

第一个参数maxlength为字符串的长度，arg为补全的字符，比如：

即1字符串要在开头用0来补齐，补到字符串长度为10位，而padEnd()与padStart()相反，则是在字符串结尾进行补齐，padEnd()与padStart()只能应用于字符串，所以在使用时需要先将数字或者时间转换位字符串。对月日时分秒用padStart()进行补齐：

以上就是如何在Vue.js中对时间格式进行格式化，主要用到了过滤器和padEnd()与padStart()方法。

其他推荐