当前位置: 首页 > article >正文

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

文章目录

    • 概要
    • 整体架构流程
    • 所用组件
    • 技术细节
    • 小结

概要

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

整体架构流程

使用moment插件实现

官网:https://momentjs.cn/

所用组件

  • vue2
  • moment

技术细节

  • 首先执行 npm install moment - -save
  • 然后在main.js添加以下代码
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里面直接使用
  <el-table-column label="创建时间" min-width="100px" prop="createTime" >
        <template slot-scope="{row}">
          <span>{{ row.createTime | formatDate }}</span>
        </template>
      </el-table-column>

小结

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


http://www.kler.cn/news/285017.html

相关文章:

  • 怎样通过bs4找出程序中 标签<div class=“List2“>中所有的<li>的内容?
  • 前端如何在30秒内实现吸管拾色器?
  • Golang | Leetcode Golang题解之第386题字典序排数
  • 合并多个rtf文件
  • 从零开始学习SLAM六(单应矩阵)
  • 探索视觉的边界:PyTorch与TorchVision的深度融合
  • zabbix4.0 实现钉钉告警
  • [ABC001A] 積雪深差
  • [服务器_1]rpc框架收集
  • 如何五分钟使用 Cocos Creator 快速部署 TON 游戏(第一部分)
  • Docker容器技术(下)超多好上手的实验,保姆级教程
  • 【时间盒子】-【1.序言】高效人士都在用的时间管理方法。我是如何通过鸿蒙元服务APP实现?
  • 深度学习第一周周报
  • Sobel算子,Scharr算子和Laplacian算子
  • 如何利用 Go 语言开发高性能服务
  • Fetch API 的基本使用
  • 探索JSON Schema的世界
  • 小程序使用iconfont字体图标
  • 【Unity-UGUI组件拓展】| ContentSizeFitter 组件拓展,支持设置最大宽高值
  • 网页html版——在线查字典的一个web服务器
  • Android 移除最近任务列表展示
  • CSND文章质量分批量查询
  • 类图的关联关系
  • Python基础 3 - 函数及数据容器
  • JAVA毕业设计167—基于Java+Springboot+vue3+小程序的物业管理系统小程序(源代码+数据库+万字论文+文献综述)
  • Llamaindex RAG实践
  • 并发服务器
  • 代码随想录算法训练营第六十天 | 图论part10
  • SkyWalking部署(监控系统)
  • jquery下载的例子如何应用到vue中