千家信息网

不使用过滤器该怎样实现vue3时间戳转换

发表于:2025-01-24 作者:千家信息网编辑
千家信息网最后更新 2025年01月24日,这期内容当中小编将会给大家带来有关不使用过滤器该怎样实现vue3时间戳转换,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。vue2转换时间戳的时候一般使用过滤器的方式
千家信息网最后更新 2025年01月24日不使用过滤器该怎样实现vue3时间戳转换

这期内容当中小编将会给大家带来有关不使用过滤器该怎样实现vue3时间戳转换,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

vue2转换时间戳的时候一般使用过滤器的方式,到vue3之后,vue3移除了过滤器,就不能再用了,官方是推荐使用方法或者计算属性的方式。

下面写了一个Time.ts的文件,可以针对时间戳进行转换:

class Time {    // 格式化时间    public formatTime(time: number) {        let date = new Date(time * 1000);        let year = date.getFullYear();        let month = date.getMonth() + 1;        let day = date.getDate();        let hour = date.getHours();        let minute = date.getMinutes();        let second = date.getSeconds();        return year + "-" + month.toString().padStart(2, "0") + "-" + day.toString().padStart(2, "0")            + " " + hour.toString().padStart(2, "0") + ":" + minute.toString().padStart(2, "0")            + ":" + second.toString().padStart(2, "0");    }} const time = new Time();export default time;

使用的话,只要在模板调用这个方法,然后传入对应的时间戳就可以了。

{{ time.formatTime(timestamp) }}

显示的效果:

2021-05-17 10:59:59

目前只能转换成如上格式,如果需要更多的格式,可以在formatTime增加第2个参数,表示格式化的时间格式,然后依着转化就行了。

上述就是小编为大家分享的不使用过滤器该怎样实现vue3时间戳转换了,如果刚好有类似的疑惑,不妨参照上述分析进行理解。如果想知道更多相关知识,欢迎关注行业资讯频道。

0