vue使用过滤器filters

1、filter的使用

<div>
		<!--过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)-->
		<div>{{ num | numFilter }}</div>   
		<!-- numFilter 过滤器函数将会收到 num 的值作为第一个参数-->
		
		<div :id="num1 | idFilter"></div>
		
		<div>{{ num | numberFilter(num1, num2) }}</div>
		<!--numberFilter 被定义为接收三个参数的过滤器函数。其中 number 的值作为第一个参数，num1 的值作为第二个参数，num2的值作为第三个参数。-->
	</div>

export default{
		data(){
			return{
				num:1.123, num1:1, num2:1,
			}
		},
		filters:{
			numFilter:function(val){
				if (!val) return ''
				val=Number(val).toFixed(2);
				return val       //console.log(val)  1.12
			},
			idFilter:function(val){
				if (!val) return ''
				val=`index-${val}`;
				return val   //console.log(val)  index-1
			},
			numberFilter:function(val1,val2,val3){
				return val1+val2+val3   //console.log(val1+val2+val3)  3.123
			}
		},
	}

2、v-html 使用过滤器filters
例：将后台返回的文本数据中的英文标点都变成中文标点符号
（1）

<p v-html="$options.filters.repSign(sub_title)">{{sub_title}}</p>

（2）

	filters: {
			 interchange(str) {
				if(str== '' || str == null) {
					return str
				} else {
					str = str.replace(/([\u4E00-\u9FA5]|^|\n|\r)([\,\.\?\!\:\;])(?=[\u4E00-\u9FA5]|$|\n|\r)/g, function(u, v, w, x) {
						var sign = {
							',': '，',
							'.': '。',
							'?': '？',
							'!': '！',
							':': '：',
							';': '；'
						};
						return sign[w] ? v + sign[w] : u;
					});
					return str;
				}
			},