Vue3:el-table实现日期的格式化

后端如果返回的是时间戳,需要我们进行日期格式化

例如:2024-09-11T14:19:14

定义一个日期解析的工具组件

javascript 复制代码
export function formatDateAsYYYYMMDDHHMMSS(dateStr: any) {
    const date = new Date(dateStr);
    const year = date.getFullYear();
    const month = String(date.getMonth() + 1).padStart(2, '0');
    const day = String(date.getDate()).padStart(2, '0');
    const hours = String(date.getHours()).padStart(2, '0');
    const minutes = String(date.getMinutes()).padStart(2, '0');
    const seconds = String(date.getSeconds()).padStart(2, '0');
    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}

在表格中进行使用该工具完成日期解析

javascript 复制代码
   <el-table-column fixed label="发布时间" width="150">
            <template #default="scope">{{ formatDateAsYYYYMMDDHHMMSS(scope.row.createTime) }}</template>
   </el-table-column>
相关推荐
前端小L7 小时前
双指针专题(三):去重的艺术——「三数之和」
javascript·算法·双指针与滑动窗口
web小白成长日记7 小时前
在Vue样式中使用JavaScript 变量(CSS 变量注入)
前端·javascript·css·vue.js
C_心欲无痕8 小时前
react - useImperativeHandle让子组件“暴露方法”给父组件调用
前端·javascript·react.js
霖鸣9 小时前
Minecraft通过kubejs进行简单魔改
javascript
JackieDYH9 小时前
HTML+CSS+JavaScript实现图像对比滑块demo
javascript·css·html
全栈前端老曹10 小时前
【前端路由】Vue Router 嵌套路由 - 配置父子级路由、命名视图、动态路径匹配
前端·javascript·vue.js·node.js·ecmascript·vue-router·前端路由
EndingCoder10 小时前
安装和设置 TypeScript 开发环境
前端·javascript·typescript
张雨zy11 小时前
Vue 项目管理数据时,Cookie、Pinia 和 LocalStorage 三种常见的工具的选择
前端·javascript·vue.js
五月君_11 小时前
Nuxt UI v4.3 发布:原生 AI 富文本编辑器来了,Vue 生态又添一员猛将!
前端·javascript·vue.js·人工智能·ui
一个处女座的程序猿O(∩_∩)O11 小时前
现代前端开发的三大支柱:TypeScript、ESLint、Prettier 深度解析与完美协作
javascript·typescript