舊版瀏覽器中的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