[Vue] filter

필터 생성

전역필터

자주 쓰는 필터라면 filter.js 를 만들고

import Vue from "vue"

Vue.filter('status', function (value) {
  const statusMap = {
    published: 'success',
    draft: 'gray',
    deleted: 'danger'
  };
  return statusMap[status];
});

이런식으로 필터함수를 만들어주고  main.js에 import "../src/common/filter" 해주면
따로 선언할 필요없이 바로 사용가능

 

로컬 필터

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

필터 사용

html 에서 사용할 때

{{ message | filterA | filterB }}

 

js 에서 사용할 때

 

this.$options.filters.capitalize(this.word);

더 자세한 내용은 요기

https://kr.vuejs.org/v2/guide/filters.html