【vue】中filters里不能使用this解决

在定义的filters里无法拿到this。
根据官方文档可知道，过滤器传入的参数将从第二个形参开始，那么就可以通过过滤器传参实现。
在data方法返回的对象中定义that赋值this（data中可以访问到this），在使用过滤器时候将that(this)作为参数传入，那么过滤器内即可拿到that(this)。

示例：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<template>
	<div>
    <p>{{ orderDetails.paymentStatus | paymentStatus(that) }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      that: this,
      orderDetails:{}
    }
  },
  filters: {
    paymentStatus(value, that) {
      // 直接拿this是不行的，可以通过过滤器传参的方式间接拿到this
      if (value == 'payment') {
        return that.locales.DingDanXiangQing.YiZhiFu
      } else if (value == 'unpayment') {
        return that.locales.DingDanXiangQing.WeiZhiFu
      } else if (value == 'refund') {
        return that.locales.DingDanXiangQing.YiTuiKuan
      } else {
        return ''
      }
    }
  }
}
</script>