如何通过'name'来应用vue.js过滤器

Question

我们如何通过它的'name'来调用/应用 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会将col.format指向的函数应用于foo变量，然后再渲染它。