旧版浏览器中的Vue.js条件渲染

Question

我正在尝试按搜索字词过滤集合。 当我使用es6语法并内置诸如string.includes（''）之类的功能时，它可以正常工作。 不幸的是，我必须支持一些没有ES6的IE版本，因此在某些情况下，我必须使用纯JavaScript编写脚本。

chrome中的工作代码，而不是IE中的工作代码：

var vm = new Vue({
    el: '#app',
    data:{        
        term: '',
        products: [{ ProductCode: '3 Year Fixed'}, { ProductCode: 'Not fixed '},{ ProductCode: '3 Year Fixed'}, { ProductCode: '4 Year Fixed'}, { ProductCode: '5 Year Fixed'}]
    },
    computed:{
        filteredProducts: function(){
               if(this.term === ''){
                   return this.products;
               }else{
                   return this.products.filter(
                       product => product.ProductCode.includes(this.term));

               }               
        }
    }  
})

所以我写了这段代码，它虽然行不通，但无法找出为什么不行：

 computed:{
        filteredProducts: function(){
               if(this.term === ''){
                   return this.products;
               }else{
                    return this.products.filter(function(product){
                       return product.ProductCode.idexOf(this.term) !== -1
                   })


               }

我检查了文档，对我来说看起来一样：

computed: {
  evenNumbers: function () {
    return this.numbers.filter(function (number) {
      return number % 2 === 0
    })
  }
}

Answer 1

正确的解决方案是，上下文在filter函数中已更改一次，因此我不得不缓存this 。

var self = this;

另一种解决方案是仅使用Vue实例属性。 vm.term