几个简单好用的vue2.0全局过滤器(小数点后位数,货币,日期) - weixin_39100687的博客 - CSDN博客

安宇雨 - 随手采集
2019-02-18 11:11:48
随手采集
0000-未整理-等待研究

之前是用angular的,转到VUE因为用的vue-cli,直接跳过了vue自带过滤器的版本,当用的时候就有点无措了,所以按照angular的习惯写了几个简单的过滤器,如下:

ps:1. 因为用的vue-cli,这些代码位于src下的main.js

2.至于orderBy,limitTo和filter一般使用会配合v-for,而vue2.0使用过滤器不再支持v-for,所以不在本次说明咯.........

//number 显示小数点后数字的个数因为用的toFixed方法,是四舍五入的

Vue.filter('number', function(value, num) {
if(!value)
return ''
if(arguments.length == 1)
return value;
if(arguments.length == 2)
return (value/1).toFixed(num);

})

//货币过滤器默认美元符
Vue.filter('currency', function(value, symbol) {
if(!value)
return ''
if(arguments.length == 1)
return '$' + value;
if(arguments.length == 2)
return symbol + value;
})

// data 过滤器一个参数
// yyyy表示年 MM表示月 dd表示日期 HH表示时 mm表示分 SS表示秒 DD表示星期
Vue.filter('date', function(value, format) {
var value = new Date(value);
var _ = /([a-zA-Z]+|[^A-Za-z]+)/g;
var time = format.match(_);
for(var i = 0; i < time.length; i++) {

if(time[i] == 'yy')
time[i] = value.getFullYear() % 100;
if(time[i] == 'yyyy')
time[i] = value.getFullYear();
if(time[i] == 'MM')
time[i] = value.getUTCMonth() + 1;
if(time[i] == 'dd')
time[i] = value.getDate();
if(time[i] == 'HH')
time[i] = value.getHours();
if(time[i] == 'mm')
time[i] = value.getMinutes();
if(time[i] == 'SS')
time[i] = value.getSeconds();
if(time[i] == 'DD')
time[i] = value.getDay();
}
return time.join('');
})

//首字母大写
Vue.filter('uppercase', function(value) { //全局过滤器
if (!value)
return ''
value = value.toString()
return value.charAt(0).toUpperCase() + value.slice(1)
})

//使用如下

//显示为 17-9-19

Original url: Access
Created at: 2019-02-18 11:11:47
Category: default
Tags: none

未标明原创文章均为采集，版权归作者所有，转载无需和我联系，请注明原出处，南摩阿彌陀佛，知识，不只知道，要得到

请先后发表评论