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


---> at src\components\search.vue
        at src\App.vue
         

后来查看原来是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");



你可能感兴趣的:(vue)