Question

我正在尝试构建一个自定义过滤器，它返回与输入匹配的项目。它适用于简单数组，例如['Apple', 'Banana', 'Cupple']。但是没有一个对象数组（我试图使用它来过滤包含用户信息的数组）

 filterBy: function (arr, value) {
              return arr.filter(function(item) {
                item = item.toString();
                  return item.indexOf(value) > -1;
          })

    },

在我有的模板中

            <input v-model="userInput" />

            <h2> Customer: </h2>
            <ul v-for="customer in filterBy(customers, userInput)">
                <li>{{customer.name}}</li>
            </ul>

编辑：这就是数据的样子。

     "data":[{"id":"9","name":"missy","phone":"21324234532"},     
     {"id":"3","name":"Mahama","phone":"345604542"}]

如何获得与给定输入匹配的客户？

Answer 1

假设您的对象数组如下所示：

[
  {"id":"9","name":"missy","phone":"21324234532"},   
  {"id":"3","name":"Mahama","phone":"345604542"},
  {"id":"2","name":"Bernard","phone":"241242542"}
]

正如评论中指出的那样：someObject.toString()通常会返回[object Object]，所以它对过滤任何内容都没有用。您可能已经期望使用JSON.stringify(someObject)获得JSON输出，但是更好和准确的方法是访问该特定密钥。

您可以修改如下功能：

 filterBy: function (arr, value) {
              return arr.filter(function(item) {
                  return item.name.indexOf(value) > -1;
          })

    },

vue 2.0中的自定义过滤器什么都不返回

1 个答案: