Vue2 过滤器的使用

223 阅读1分钟

1. 局部注册

局部注册过滤器使用 filters 和 data 平级
当局部过滤器名字和全局一样的时候优先使用局部的

`filters: {
    forMat(time) {
      const y = time.getFullYear()
      const m = time.getMonth() + 1
      const d = time.getDate()
      return `${y}-${m}-${d}`
    }
  },`
  data() {
    return {
      time: new Date()
    }
  },
  

过滤前:{{ time }}

Wed Apr 06 2022 21:25:11 GMT+0800 (中国标准时间)

过滤后:{{ time |forMat }}

2022-4-6

2. 全局过滤器

直接在 main.js 里面全局注册

  Vue.filter(过滤器名称,处理函数)
  处理函数中的第一个参数是: 需要被处理的参数
  
  `
  Vue.filter('forMat', (data) => {
  const time = new Date(data)
  const mm = (time.getMonth() + 1).toString().padStart(2, 0)
  const dd = time.getDate().toString().padStart(2, 0)
  return `${yy}-${mm}-${dd}`
})
  `