TypeError：this.decodeHtml不是函数

Question

我刚迁移到VueJS 2，现在，我有一个问题。

在过滤器中，我调用自定义函数，但得到：TypeError: this.decodeHtml is not a function

这是我的代码：

 new Vue({
         el: '#modal',
         data: {...}
         computed: {...}
         methods: {
                decodeHtml: function decodeHtml(html) {
                        var txt = document.createElement("textarea");
                        txt.innerHTML = html;
                        return txt.value;
                    },
         ... },
        filters: {
                    html: function html(_html) {
                        return this.decodeHtml(_html);
                    }
                }

在我的HTML中，我称之为：@{{ categoryFullName | html }}

知道为什么???在迁移之前，它工作正常。

以下是fiddle

Answer 1

您的范围有问题。在html函数中，this变量是Window对象，而不是Vue对象。

您可以执行的解决方法是调用在过滤器中实现它的decodeHtml函数。像这样：

filters: {
  html: (html) => {
    var txt = document.createElement("textarea");
    txt.innerHTML = html;
    return txt.value;
  }
}