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>
相关推荐
Cherry的跨界思维13 分钟前
【AI测试全栈:Vue核心】22、从零到一:Vue3+ECharts构建企业级AI测试可视化仪表盘项目实战
vue.js·人工智能·echarts·vue3·ai全栈·测试全栈·ai测试全栈
ssshooter33 分钟前
复古话题:Vue2 的空格间距切换到 Vite 后消失了
前端·vue.js·面试
Van_Moonlight1 小时前
RN for OpenHarmony 实战 TodoList 项目:任务完成进度条
javascript·开源·harmonyos
Van_Moonlight1 小时前
RN for OpenHarmony 实战 TodoList 项目:深色浅色主题切换
javascript·开源·harmonyos
小贵子的博客1 小时前
Ant Design Vue <a-table>
前端·javascript·vue.js·anti-design-vue
天天进步20151 小时前
【Nanobrowser源码分析4】交互篇: 从指令到动作:模拟点击、滚动与输入的底层实现
开发语言·javascript·ecmascript
console.log('npc')1 小时前
vue2中子组件父组件的修改参数
开发语言·前端·javascript
Van_captain1 小时前
rn_for_openharmony常用组件_Chip纸片
javascript·开源·harmonyos
奋斗吧程序媛2 小时前
vue3 Study(1)
前端·javascript·vue.js
QQ12958455042 小时前
ThingsBoard - APP首页修改为手工选择组织
前端·javascript·物联网·iot