过滤器filter正确使用

最新推荐文章于 2022-11-28 14:38:20 发布

原创最新推荐文章于 2022-11-28 14:38:20 发布 · 831 阅读

0 ·

CC 4.0 BY-SA版权

vue 专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何在Vue中创建一个全局的时间格式化过滤器，实现所有VM实例共享，可自定义时间显示格式，如'yyyy-MM-dd'或'yyyy-MM-dd HH:mm:ss'。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天遇到要过滤一个时间过滤器，把定义好的filter写在main.js，其他组件可以直接调用
比如说

举个例子
// 全局的过滤器，进行时间的格式化
// 所谓的全局过滤器，就是所有的VM实例都共享的
Vue.filter(‘dateFormat’, function (dateStr, pattern = “”) {
// 根据给定的时间字符串，得到特定的时间
var dt = new Date(dateStr)

  //   yyyy-mm-dd
  var y = dt.getFullYear()
  var m = dt.getMonth() + 1
  var d = dt.getDate()

  // return y + '-' + m + '-' + d



  if (pattern.toLowerCase() === 'yyyy-mm-dd') {
    return `${y}-${m}-${d}`
  } else {
    var hh = dt.getHours()
    var mm = dt.getMinutes()
    var ss = dt.getSeconds()

    return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
  }
})