要求使用Laravel webpack的Vue过滤器

Question

我使用Laravel 5.4和webpack的Vue 2。我在全球载入我的部件通过要求相关的.vue文件：

Vue.component('tabs', require('./components/global/Tabs.vue')); 

在.vue文件我有一个脚本标签与出口默认{...}，一切工作正常。现在我想加载一个具有相同要求的过滤器，但我无法以任何形式进行操作。该过滤器是：

Vue.filter('formatbytes', function (bytes, decimals) { 

if (bytes == 0) return '0 Bytes'; 
var k = 1000, 
    dm = decimals + 1 || 3, 
    sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], 
    i = Math.floor(Math.log(bytes)/Math.log(k)); 

    return parseFloat((bytes/Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; 

}); 

上述工作正常，但是，我怎么能把过滤器逻辑放在一个单独的.vue文件？

export default { 
filters: { 
    formatbytes: function (bytes, decimals) { 
     ... 
    } 
    } 
} 

另：我有没有运气以下测试

export default { 
formatbytes: function (bytes, decimals) { 
    ... 
    } 
} 

Answer 1

可以导出使用export default功能，以及对象和你不需要把它在.vue组件

试着改变你的代码：

export default function (bytes, decimals) { 
    if (bytes == 0) return '0 Bytes'; 
    var k = 1000, 
    dm = decimals + 1 || 3, 
    sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], 
    i = Math.floor(Math.log(bytes)/Math.log(k)); 

    return parseFloat((bytes/Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; 
} 

和你需要应该工作

vue.filter('formatbytes', require('/path/to/filter/formatbytes.js'))