如何在vuejs webpack加载器模板中创建自定义过滤器？

Question

我在文档中看到过。它告诉像

Vue.filter('reverse', function (value) { 
    return value.split('').reverse().join('') 
}) 

我试图创建在vuejs的WebPack装载机滤波器

export default { 
    filter: { 
    reverse: function(value) { 
     return value.split('').reverse().join('') 
    } 
    } 
} 

但它不工作创建过滤器。任何人都建议如何实施。

Answer 1

我相信你需要filters在filter代替：

export default { 
    filters: { 
    reverse: function(value) { 
     return value.split('').reverse().join('') 
    } 
    } 
} 

Answer 2

根据在遵守文件中的函数checkFilters vue.common.js

/** 
* Check read/write filter stats. 
*/ 

checkFilters: function checkFilters() { 
    var filters = this.filters; 
    if (!filters) return; 
    var i = filters.length; 
    while (i--) { 
    var filter = resolveAsset(this.vm.$options, 'filters', filters[i].name); 
    if (typeof filter === 'function' || filter.read) { 
     this.hasRead = true; 
    } 
    if (filter.write) { 
     this.hasWrite = true; 
    } 
    } 
}, 

所以，如果它是一个单向的过滤器，它必须是一个功能。如果它是一个双向过滤器，它是一个具有读属性的对象，它至少是一个函数。

所以，在VUE文件，如果你想自定义过滤器，你应该这样写：

export default { 
    filters: { 
    "reverse": function(value) { 
     return value.split('').reverse().join('') 
    } 
    } 
} 

如果它是一个双向的过滤器，你应该这样写：

export default { 
    filters: { 
    "reverse": { 
     read: function(value) { 
     return value.split('').reverse().join('') 
     }, 
     write: function(val, oldVal) { //this is not neccessary 
     //something you want to return 
     } 
    } 
    } 
}