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>
相关推荐
wusp199419 小时前
v-model 和 :value 的深度解析
前端·javascript·vue.js
2501_9444241219 小时前
Flutter for OpenHarmony游戏集合App实战之记忆翻牌表情图案
开发语言·javascript·flutter·游戏·harmonyos
Code知行合壹19 小时前
Vue项目中SVG图标
前端·vue.js
pas13619 小时前
34-mini-vue 更新element的children-双端对比diff算法
javascript·vue.js·算法
小二·19 小时前
Python Web 开发进阶实战:数字孪生平台 —— 在 Flask + Vue 中构建实时物理世界镜像
前端·vue.js·python
ashcn200119 小时前
websocket测试通信
前端·javascript·websocket
吃吃喝喝小朋友20 小时前
JavaScript文件的操作方法
开发语言·javascript·ecmascript
Trae1ounG20 小时前
模块间通信解耦
javascript
2501_9445264220 小时前
Flutter for OpenHarmony 万能游戏库App实战 - 知识问答游戏实现
android·开发语言·javascript·python·flutter·游戏·harmonyos
卿着飞翔20 小时前
Vue使用yarn进行管理
前端·javascript·vue.js