vue+moment转化日期格式为年月日时分秒!最简洁版

文章目录

概要

全局实行格式化日期,让你告别冗余处理时间代码

整体架构流程

使用moment插件实现

官网:https://momentjs.cn/

所用组件

  • vue2
  • moment

技术细节

  • 首先执行 npm install moment - -save
  • 然后在main.js添加以下代码
csharp 复制代码
import moment from 'moment'
//如果你的main.js每个组件都要vue.use那就加上Vue.use(moment)

Vue.filter('formatDate', function(value) {
  if (value) {
    if (value === '-') {
      return '-'
    } else {
      return moment(value).format('YYYY-MM-DD HH:mm:ss')
    }
  } else {
    return ''
  }
})
  • 然后直接在table里面直接使用
csharp 复制代码
  <el-table-column label="创建时间" min-width="100px" prop="createTime" >
        <template slot-scope="{row}">
          <span>{{ row.createTime | formatDate }}</span>
        </template>
      </el-table-column>

小结

不管用什么ui组件库,这个方法均适用,快用起来吧兄弟们!!!记得给我点赞加关注奥,好东西在后面

相关推荐
GISer_Jing8 分钟前
前端学习总结——AI&主流前沿方向篇
前端·人工智能·学习
渣哥17 分钟前
用错注入方式?你的代码可能早就埋下隐患
javascript·后端·面试
尘世中一位迷途小书童18 分钟前
Monorepo 工具大比拼:为什么我最终选择了 pnpm + Turborepo?
前端·架构
一枚前端小能手20 分钟前
🔍 重写vue之ref和reactive
前端·javascript·vue.js
星链引擎22 分钟前
4sapi.com开发者进阶版(技术导向,侧重 “原理 + 最佳实践”)
前端
尘世中一位迷途小书童23 分钟前
2025年了,你还在用传统的多仓库管理吗?Monorepo 架构深度解析
前端·架构
fruge26 分钟前
前端性能优化实践指南:从理论到落地
前端·性能优化
快起来别睡了30 分钟前
用这 9 个 API,我把页面性能干到了 90+
前端
芒果茶叶42 分钟前
深入浅出requestAnimationFrame
前端·javascript·html
歪歪10044 分钟前
在哪些场景下适合使用 v-model 机制?
服务器·前端·javascript·servlet·前端框架·js