vue中的过滤器更偏向于对文本数据的转化，而不能依赖this上下文，如果需要使用到上下文this我们应该使用computed计算属性的或者一个method方法

<template>
	<div id="app">
	{{ a | dealSum}}
	</div>
</template>

<script>
	export default {
		name: 'App',
		data() {
			return {
				a: 10,
				b: 20
			}
		},
		filters:{
			dealSum(val){
				console.log(val) //10
				console.log(this) //undefined
			}
		}
	}
</script>

解决方案一:我们可以在data中定义that=this,通过过滤器传入进去 ，就可以获取到this对象以及参数了

	<div id="app">
	{{ a | dealSum(that)}}
	</div>


	data() {
	    return {
                that:this,
		a: 10,
		b: 20
		}
	 },
	filters:{
		dealSum(val,that){
			console.log(val) //10
			console.log(that.a) //10
                        return val+that.b
			}
		}
	}

解决方案二:采用computed计算属性

 <div id="app">
	{{ dealSum}}
 </div>

    computed:{
	dealSum(){
	return this.a+this.b
	}
     }

解决方案三:采用method函数方式实现

  <div id="app">
	{{ dealSum()}}
  </div>
    methods:{
	    dealSum(){
		return this.a+this.b
		}
	}