Vue

Vue 直接 call filter 的使用方法

使用 vue2 當中經常會用 filter 來處理資料顯示的格式，好處是不會動到原本的 data，通常都會將方法全域註冊在 vue 中，如果每個 component 都要定義一遍實在是不夠 dry 。

2021年4月11日 • 1 min read

範例

html

<div>{{ money | numberDecimal }}</div>

Vue.filter('numberDecimal', function (val) {
  if (!val) {
    return "";
  }
  return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
})

定義完之後，如果想要直接 call numberDecimal 可以用

this.$options.filters.numberDecimal(this.money);