如何通過名稱應用vue.js過濾器

Question

我們如何通過名稱調用/應用vue.js過濾器？

例如：col.format == 'date_format'，其中date_format是vue.js 過濾

的是的cols像這樣定義：

cols = [ 
    {field: 'dt_joined', format: 'date_format'}, 
    {field: 'dt_trained', format: 'date_format'}, 
    {field: 'salary', format: 'money_format'} 
] 

// register filters 
Vue.filter('date_format', function (x) { 
    return x === null ? null : new Date(x).toISOString().slice(0, 10) 
}) 

td(v-else-if='col.format') {{ props.item[col.field] | col.format }} 
td(v-else) {{ props.item[col.field] }} 

//- td {{ props.item.dt_joined | date_format }} 
//- td {{ props.item.salary | money_format }} 

Answer 1

在你的榜樣，你就需要設置col.format是實際函數，而不是函數的名稱：

let date_format = Vue.filter('date_format'); 
let money_format = Vue.filter('money_format'); 

let cols = [ 
    { field: 'dt_joined', format: date_format }, 
    { field: 'dt_trained', format: date_format }, 
    { field: 'salary', format: money_format } 
] 

然後foo | col.format將應用t在呈現它之前，他的功能被col.format指向foo變量。