vue 全局filter 和局部filter

在项目中不可避免的有时会用到过滤器，于是先在局部使用过滤器

在单个组件内局部调用过滤器

< span class= "fr" >浏览量:{{ item. number | BrowsingVolume }}+ </ span >

created(){

},

filters:{

BrowsingVolume: function( value){

return value. toFixed( 2);

}

},

而页面一直在报下面的错误

[Vue warn]: Error in render: "TypeError: value.toFixed is not a function"


found in


---> <Search> at src\components\search.vue
       <App> at src\App.vue
         <Root>

后来查看原来是value从后台获取的是字符串，所以使用不了toFixex()这个函数，于是

< span class= "fr" >浏览量:{{ item. number | BrowsingVolume }}+ </ span >

created(){

},

filters:{

BrowsingVolume: function( value){

value = Number( value);

return value. toFixed( 2);

}

},

这样之后页面加载出来 并显示正常的保留2位小数。

如果多个功能都需要使用同一个过滤器，则可以将这个过滤器设置到全局过滤器

在main.js中设置全局过滤器

Vue. filter( 'BrowsingVolume', function( value){

value = Number( value);

return value. toFixed( 2);

});

var getFilter= Vue. filter( "BrowsingVolume");