1.日期格式化
date = '2022/03/03';
timestamp_1 = 1646298588; // 时间戳 单位秒
timestamp_2 = 1646298835000; // 时间戳 毫秒
{{date | formatDateTime('yyyy-MM-dd')}} // 2022-03-03
{{date | formatDateTime('yyyy年MM月dd日')}} // 2022年03月03日
// 单位秒的时间戳 * 1000 = 毫秒时间戳
{{timestamp_1 * 1000 | formatDateTime('yyyy年MM月dd日')}} // 2022年03月03日
{{timestamp_1 * 1000 | formatDateTime('yyyy-MM-dd hh:mm:ss')}} // 2022-03-03 17:09:48
{{timestamp_2 | formatDateTime('yyyy年MM月dd日')}} // 2022年03月03日
{{timestamp_2 | formatDateTime('yyyy-MM-dd hh:mm:ss')}} // 2022-03-03 17:13:55
{{timestamp_2 | formatDateTime('yyyy小MM中dd大')}} // 2022小03中03大
filters: {
formatDateTime(time, fmt) {
if (time == null || time === '') {
return '暂无';
}
let date = new Date(time);
return formatDate(date, fmt)
},
}
/**
* @param {date} date
* @param {string} fmt
* @return {string}
*/
export const formatDate = (date, fmt) => {
var o = {
'M+': date.getMonth() + 1, // 月份
'd+': date.getDate(), // 日
'h+': date.getHours(), // 小时
'm+': date.getMinutes(), // 分
's+': date.getSeconds(), // 秒
'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
S: date.getMilliseconds() // 毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(
RegExp.$1,
(date.getFullYear() + '').substr(4 - RegExp.$1.length)
);
}
for (var k in o) {
if (new RegExp('(' + k + ')').test(fmt)) {
fmt = fmt.replace(
RegExp.$1,
RegExp.$1.length === 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length)
);
}
}
return fmt;
};
2.分隔数字,每隔3位使用逗号进行分隔
value_1 = 123456789.223
value_2 = 254
{{value_1 | toThousandFilter}} // 123,456,789.223
{{value_2 | toThousandFilter}} // 254
/**
* @param {number} num
* @return {string}
*/
export function toThousandFilter(num) {
if(!num){
return '';
}
return (+num || 0).toString().replace(/^-?\d+/g, m => m.replace(/(?=(?!\b)(\d{3})+$)/g, ','))
}
3.单词大小写转换
{{'value' | textTransform(0)}} // Value 首字母大写
{{'value' | textTransform(1)}} // VALUE 全大写
{{'VALUE' | textTransform(2)}} // value 全小写
/**
* @param {String} string
* @param {number} type
* @return {string}
*/
export function textTransform(string, type) {
let json = '';
switch(type){
case 0:
json = string.charAt(0).toUpperCase() + string.slice(1);
break;
case 1:
json = string.toUpperCase();
break;
case 2:
json = string.toLowerCase();
break;
default:
json = string
}
return json
}
4.数值格式转换 1000=>1K 1000000 =>1M ...
{{1000 | numberFormatter(2)}} // 1K
{{1040 | numberFormatter(2)}} // 1.04K
{{1000000 | numberFormatter(2)}} // 1M
{{1060000 | numberFormatter(2)}} // 1.06M
{{1000000000 | numberFormatter(2)}} // 1G
/**
* @param {number} num
* @param {number} digits
* @return {string}
*/
export function numberFormatter(num, digits) {
const si = [
{ value: 1E18, symbol: 'E' },
{ value: 1E15, symbol: 'P' },
{ value: 1E12, symbol: 'T' },
{ value: 1E9, symbol: 'G' },
{ value: 1E6, symbol: 'M' },
{ value: 1E3, symbol: 'k' }
]
for (let i = 0; i < si.length; i++) {
if (num >= si[i].value) {
return (num / si[i].value).toFixed(digits).replace(/\.0+$|(\.[0-9]*[1-9])0+$/, '$1') + si[i].symbol
}
}
return num.toString()
}
博主会持续更新过滤器的方法,有小伙伴想要什么处理的过滤器也可告诉我,博主看到会整理的