第一句子网 - 唯美句子、句子迷、好句子大全
第一句子网 > vue 如果2个/多个过滤器(filter)同时使用并传参数?

vue 如果2个/多个过滤器(filter)同时使用并传参数?

时间:2023-10-05 21:16:03

相关推荐

vue 如果2个/多个过滤器(filter)同时使用并传参数?

html:

<!-- 无参数 ,页面显示 19.98--><div>{{19.9866666|formatNum_mod}}</div><!-- 需要传参数 ,页面显示 19.9866--><div>{{19.9866666|formatNum_mod(4)}}</div>

js:

//vue 文件中,js部分import { formatNum_mod } from '@/utils/public'export default {filters: {formatNum_mod(val,nums_after_point) {console.log(val,nums_after_point)// 传入值(4),则输出:19.9866666,4return formatNum_mod(val,nums_after_point)}}

(utils下的) public.js 文件:

// utils下的 public.js 文件,如下:// 千分位 : formatNum_mod(1234567893.99)。 nums_after_point:截取到小数点后nums_after_point位(不四舍五入,直接截断),默认后两位)export function formatNum_mod(number, nums_after_point = 2) {if (!number) return ''let n = Number(number).toFixed(2).toString();let r = '';let temp = '';let mod = '';// v= Number(f).toFixed(2);do {// 求模的值, 用于获取高三位,这里可能有小数mod = n % 1000;// 值是不是大于1,是继续的条件n = n / 1000;// 高三位temp = ~~mod;// 1.填充: n > 1 循环未结束, 就要填充为比如 1 => 001// 不然temp = ~~mod的时候, 1 001, 就会变成 "11"// 2.拼接“,”r = (n >= 1 ? `${temp}`.padStart(3, '0') : temp) + (!!r ? ',' + r : '');} while (n >= 1);const strNumber = number + '';let index = strNumber.indexOf('.');// 拼接小数部分if (index >= 0) {r += strNumber.substring(index, index + nums_after_point + 1); // 截取到小数点后两位, (因为小数点占一位,所以后面要+1)}return r;}

tips:

html中传入的4(虽然在参数的第一位),但在vue文件中的js部分,会赋值给filter中的 nums_after_point参数,而sumCount值会赋给filter中 的val参数。所以console.log打印出来的是

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。