vue过滤器

定义

局部

filters: {
  capitalize: function (value) {
    if (!value) return ''
    value = value.toString()
    return value.charAt(0).toUpperCase() + value.slice(1)
  }
}

全局

Vue.filter('capitalize', function (value) {
  if (!value) return ''
  value = value.toString()
  return value.charAt(0).toUpperCase() + value.slice(1)
})
new Vue({
  // ...
})

使用

方式一：

{{ message | capitalize }}

方式二：

<div v-bind:title="message | capitalize"></div>

时间过滤

插件：moment
安装：

npm install moment -S

使用：
main.js

import Moment from 'moment'
Vue.prototype.$moment = Moment
// 横线
Vue.filter('timeLineTransverse', function (value) {
  return Moment(value).format('YYYY-MM-DD');
});
// 斜线
Vue.filter('timeLineSlant', function (value) {
  return Moment(value).format('YYYY/MM/DD');
});
// 精确到时分秒
Vue.filter('timeLineTransverseHour', function (value) {
  return Moment(value).format('YYYY-MM-DD HH:mm:ss');
});
// 其他自定义格式···
new Vue({
//...
})

组件
方式一：过滤器

{{timestamp | timeLineTransverse}}

方式二：prototype对象属性

const time = this.$moment(timestamp).format('YYYY-MM-DD HH:mm:ss')

官网

过滤器
moment