在项目开发中,我们常常需要把一些常见的文本格式化,比如说后端返回手机号需要加星号处理,或者说把一些数字加上货币单位
如果说我们把这些操作在methods选项中注册为一个方法的话,虽然也是一种可行的方法,但是其缺点也很明显:methods选项常常被用来组织页面数据和交互逻辑,简单的文本处理杂糅其中语义化不明显且methods过重
首先要注意几点:
1. vue1中的uppercase等vue自带过滤器在vue2中皆不可使用,需要时候需自定义。
2. 父组件中自定义的过滤器在子组件中无法使用,但可以使用全局过滤器或在子组件内部自定义过滤器。
3. 必须在 Vue实例初始化之前定义全局过滤器,否则定义无效。
然后我们可以愉快地写filter了,列举几个常用的filter:
/**
* 格式化金额
* @param {number} amount 金额
* @param {string} [symbol] 货币符号
* @param {number} [digits] 小数位数
* @returns {string} 格式化后的数字,默认两位小数
*/
currency(amount, symbol = '¥', digits = <