校园网站设计方案,做网站图片处理问题,云服务器做网站视屏,专业的南京网站建设Vue3.2TS在v-for的时候#xff0c;循环处理时间#xff0c;将其变成xx-xx-xx xx:xx:xx格式
最后教给大家自己封装一个时间hooks#xff0c;直接复用
1.没有封装#xff0c;直接使用
templatedivulli v-foritem,index in arr :k…Vue3.2TS在v-for的时候循环处理时间将其变成xx-xx-xx xx:xx:xx格式
最后教给大家自己封装一个时间hooks直接复用
1.没有封装直接使用
templatedivulli v-foritem,index in arr :keyitem{{index}}-----{{item}}---{{formateDate(item)}}/li/ul/div
/templatescript setup langts
const arr:string[] [Wed Aug 10 2023 16:51:08 GMT0800 (中国标准时间),Wed Aug 12 2022 16:53:03 GMT0800 (中国标准时间),Wed Aug 11 2021 16:54:04 GMT0800 (中国标准时间),Wed Aug 05 2020 16:55:03 GMT0800 (中国标准时间),Wed Aug 09 2019 16:56:01 GMT0800 (中国标准时间),
]
const formateDate (date:string) {if (!date) return ;const timer new Date(date)let year timer.getFullYear()let mouth addZero(timer.getMonth() 1)let day addZero(timer.getDate())let hour addZero(timer.getHours())let min addZero(timer.getMinutes())let sec addZero(timer.getSeconds())return ${year}-${mouth}-${day} ${hour}:${min}:${sec}
}const addZero (num:number){return num 9 ? num : 0${num}
}/script
style scoped langless
ul{list-style-type: none;li{height: 30px;line-height: 30px;background-color: aqua;margin-bottom: 10px;}
}/style假如我们现在其他地方还需要用到这个那么我们可以把这个方法封装成一个hooks用以复用
1.在src目录下新建一个utils文件夹定义一个timehandle文件将需要的时间格式转化函数放进去然后导出。
export const formateDate (date:string) {if (!date) return ;const timer new Date(date)let year timer.getFullYear()let mouth addZero(timer.getMonth() 1)let day addZero(timer.getDate())let hour addZero(timer.getHours())let min addZero(timer.getMinutes())let sec addZero(timer.getSeconds())return ${year}-${mouth}-${day} ${hour}:${min}:${sec}
}const addZero (num:number){return num 9 ? num : 0${num}
}2.在需要用到这个函数的组件内将其导入
templatedivulli v-foritem,index in arr :keyitem{{index}}-----{{item}}---{{formateDate(item)}}/li/ul/div
/templatescript setup langts
import {formateDate} from ./utils/timehandle
const arr:string[] [Wed Aug 10 2023 16:51:08 GMT0800 (中国标准时间),Wed Aug 12 2022 16:53:03 GMT0800 (中国标准时间),Wed Aug 11 2021 16:54:04 GMT0800 (中国标准时间),Wed Aug 05 2020 16:55:03 GMT0800 (中国标准时间),Wed Aug 09 2019 16:56:01 GMT0800 (中国标准时间),
]/script
style scoped langless
ul{list-style-type: none;li{height: 30px;line-height: 30px;background-color: aqua;margin-bottom: 10px;}
}/style
