vue中如何利用js函数截取时间的年月日时分秒
更新时间：2022年11月25日 09:28:32 作者：难遇你
时分秒都是跟月份一样,从0开始数的,不用+1,因为月是1-12月,而时分秒是0-23和0-59,下面这篇文章主要给大家介绍了关于vue中如何利用js函数截取时间的年月日时分秒的相关资料,需要的朋友可以参考下
前言
在vue中，从后台获取数据，如果不是sql语句（类似：select convert(char(10),GetDate(),120) as Date）获取的数据，在前台就会出现如下情况：
解决方法：
1. 使用自定义函数格式化时间数据：
（1）年月日：
var timearr = time.replace(" ", ":").replace(/\:/g, "-").split("-");
var timestr = timearr[0]+"年"+ Number(timearr[1])+ "月" + timearr[2]+"日";（2）时分
var timearr = time.replace(" ", ":").replace(/\:/g, "-").split("-");
var timestr = ""+timearr[3]+ " ：" + timearr[4]+" ";完整时间截取的方法：
getPartTime(val){
// let ti = val.split(' ');
var timearr = val.replace(" ", ":").replace(/:/g, "-").split("-");
var timestr = ""+ Number(timearr[1])+ "月" + timearr[2]+"日";
// console.log(4444,val)
return timestr;
},数据调用：
<detail-list-item term="楼栋名称">{{ item.buildingName }}</detail-list-item>
<detail-list-item term="楼栋编号">{{ item.buildingNo }}</detail-list-item>
<detail-list-item term="楼栋位置">{{ item.buildingAddress }}</detail-list-item>
<detail-list-item term="楼栋总面积">{{ item.buildingArea }}</detail-list-item>
<detail-list-item term="GPS经度">{{ item.longitude }}</detail-list-item>
<detail-list-item term="GPS纬度">{{ item.latitude }}</detail-list-item>
<detail-list-item term="楼栋总层数">{{ item.floorCnt }}</detail-list-item>
<detail-list-item term="包含公司数">{{ item.companyNumb }}</detail-list-item>
<detail-list-item term="楼栋管家">{{ item.buildingSteward }}</detail-list-item>
<detail-list-item term="建造时间">{{ getPartTime(item.buildingTime) }}</detail-list-item>格式化后数据：
自定义函数方法的好处是任何地方都可以调用这个函数进行数据格式化。
2. 利用substring函数截取：
可以先使用console.log打印数据显示数据是否符合要求：
console.log(this.buildings[0].buildingTime.substring(0, 10))
完整截取代码如下：
GetEnterpriseData(1).then(response => {
this.enterprisedata = response.result
this.buildings = this.enterprisedata[0].buildings
// console.log(this.buildings[0].buildingTime.substring(0, 10))
for (let i = 0; i < 10; i += 1) {
this.buildings[i].buildingTime = this.buildings[i].buildingTime.substring(0, 10)
console.log(this.buildings[i].buildingTime)
}
// console.log('qqqq', this.enterprisedata)
})或者：
<detail-list-item term="楼栋管家">{{ item.buildingSteward }}</detail-list-item>
<detail-list-item term="建造时间" >{{ item.buildingTime.substring(0, 10) }}</detail-list-item>截取后控制台打印数据：
3. 利用left函数截取
LEFT(string，length)函数
从字符串string中，从第一个字符开始，自左向右，截取长度为length的子串。
举个例子，string为 ‘ABCDEFG’，length为3，那么截取的子串就是’ABC’了。
4. 利用right函数截取
与上面函数类似，只是方向自右向左，例子同上，截取的子串就是’EFG’了。
总结
到此这篇关于vue中如何利用js函数截取时间的年月日时分秒的文章就介绍到这了,更多相关vue用js函数截取时间内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
您可能感兴趣的文章:
相关文章
这篇文章主要介绍了如何解决ElementPlus的el-table底白线问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-12-12
在开发后台管理系统的时候,很多地方都要用到导出excel表格,比如将table中的数据导出到本地,下面这篇文章主要给大家介绍了关于Vue导出Excel文件的相关资料,需要的朋友可以参考下2021-09-09
这篇文章主要给大家介绍了关于vscode下vue项目中eslint的使用方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-01-01
快速解决electron-builder打包时下载依赖慢的问题
使用 Electron-builder 打包,有时会在下载Electron、nsis、winCodeSign的过程中 Timeout 导致打包失败,本文给大家分享快速解决electron-builder打包时下载依赖慢的问题,感兴趣的朋友一起看看吧2024-02-02
下面小编就为大家分享一篇mint-ui 时间插件使用及获取选择值的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-02-02
element ui中的table表格数据是动态生成的,最近遇到个需求,要求我们对单元格进行合并,所以下面这篇文章主要给大家介绍了关于Element UI中table单元格合并的解决过程,需要的朋友可以参考下2022-08-08
这篇文章主要介绍了vue 获取url参数、get参数返回数组的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
这篇文章主要为大家详细介绍了一些vue使用axios的小技巧,文中的示例代码讲解详细,对我们深入掌握vue有一定的帮助,感兴趣的小伙伴可以跟随小编一起学习一下2023-10-10
这篇文章主要给大家介绍了关于vue.js Router中嵌套路由的相关资料,所谓嵌套路由就是路由里面嵌套他的子路由,文章通过示例代码介绍的非常详细,需要的朋友可以参考下2021-06-06
这篇文章主要介绍了vue-router相关基础知识及单页面应用的工作原理,需要的朋友可以参考下2018-03-03
最新评论