Vue.filter() 可以用做單一值的修改，例如:為數字加上千分位逗號、轉換時間格式...等

基本的結構會如下:

<div id="app">
    {{ 要帶入的變數 | filter名稱 }}
    {{ number | moeny }}
    {{ date | unix }}
</div>

接下來就實際來撰寫一次:

<script>
// 使用 Vue.filter 把數字加上千分號
Vue.filter('money',function(num){
    const parts = num.toString().split('.');
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
    return '$' + parts.join('.');
});

// 使用 Vue.filter 把 unix timestamp 轉成時間格式
Vue.filter('unix', function (value) {
    const time = new Date(value * 1000);
    return `${time.getFullYear()}/${time.getMonth() + 1}/${time.getUTCDate()}`
});

new Vue({
    el: '#app',
    data: {
        number: 123434635,
        date: 1595462192,
    }
})
</script>

Vue.filter() 使用上有幾個需要注意的點
其一，後面是使用 function
其二，要使用 return 回傳值，不然會跳錯