Question

是否可以应用过滤器以编程方式选择值？如您所见，我正在迭代每条记录，然后是每列。我正在检查column.id是否以d开头，这意味着它是datetime，所以我想将humanize过滤器仅应用于NaN领域。您在此处看到的代码的结果是<tr v-for="record in records" @dblClick="readRecord(record)"> <td v-for="column in columns"> {{ _.startsWith(record[column.id], 'd') ? record[column.id] | humanize : column.id; }} </td> </tr>在每个字段上。

Object.defineProperty(document, 'title', {
    set: function (newValue) {
        if(newValue != ""){
            document.getElementsByTagName("title")[0].innerHTML = newValue;
        }
    },

    get: function () {
        return document.getElementsByTagName("title")[0].innerHTML;
    }
});

Answer 1

为视图提供了一些代码厚度。最好创建一个方法（特别是因为过滤器已被弃用 - [更新]只有指令中的过滤器被弃用）。

＆＃13;

new Vue({
  el: '#app',
  data: {
    columns: [{
      id: '1'
    }, {
      id: '2'
    }],
    record: {
      2: 'dthing'
    }
  },
  methods: {
    displayCol: function(col) {
      if (s.startsWith(this.record[col.id], 'd')) {
        return this.humanize(this.record[col.id]);
      }
      return col.id;
    },
    humanize: function(recVal) {
      return `HUM${recVal}`;
    }
  }
});

＆＃13;

<!--script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script-->
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.string/3.3.4/underscore.string.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.min.js"></script>
<div id="app">
  <div v-for="column in columns">
    {{displayCol(column)}}
  </div>
</div>

＆＃13;

Answer 2

您可以在此处调用过滤器：this.$options.filters.humanize

在Vue.js组件

2 个答案: