Javascript-Vue,无法使搜索过滤器在对象数组上运行

时间:2018-08-10 02:01:24

标签: javascript vue.js

我正在尝试将此代码复制到此处,并在我的项目中使用它:http://jsfiddle.net/dkmmhf5y/701/

这是我的javascript文件,请忽略“测试”数据

{
  "records": [{/*record1*/}, {/*record2*/}, ...],
  "stats": [
    { 
      "_id" : ObjectId("5b6393f2a1d3de31d9547f63"),
      "count" : 3.0
    },
    { 
      "_id" : ObjectId("5b5d22d8b6195d1b6a5d2574"),
      "count" : 17.0
    }
  ]
}

这是我的html代码,它位于html主体内,我删除了很多html,因为我认为只有下面的内容才是问题:

var app = new Vue
  (
  {
    el: '#main',
    data: function ()
    {
      return {
        search: '',
        customers: [
          {
            id: 1,
            org: 'OOC',
            vendor: '1',
          },

          {
            id: 2,
            org: 'Golf 123Test',
            vendor: '@aboutTest',
          },

          {
            id: 3,
            org: 'AdvanceWaTest',
            vendor: '@actuTest',
          },

          {
            id: 4,
            org: 'Test4',
            vendor: 'Test3345',
          }

        ]
      };

    },

    computed:

    {
      filteredCustomers: function ()
      {
        var self = this;
        return this.customers.filter(function (cust)
        {
          return
          cust.vendor.toLowerCase().indexOf(self.search.toLowerCase()) >= 0;

        });
      }
    }


  }


  );

我可以很好地显示对象数据的整个数组,但是我不能仅仅显示在文本框中键入的数据。

1 个答案:

答案 0 :(得分:-1)

您的js中有一个黑色,如果删除它,代码将正常工作 错误图片如下https://i.stack.imgur.com/tClzp.png