vue 2.0中的自定義過濾器不會返回任何內容

我正在嘗試構建一個自定義過濾器，該過濾器返回與輸入相匹配的項目。它適用於簡單的數組，如['Apple', 'Banana', 'Cupple']。但不與對象的數組（我想用這個來過濾包含用戶信息的數組）在模板vue 2.0中的自定義過濾器不會返回任何內容

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"}]

如何獲得與給定輸入相匹配的客戶？

來源

2017-01-01 Bernard Parah

請問你的對象數組是什麼樣子？ – Saurabh

我已添加。我打算使用手機作爲搜索輸入，但返回客戶名稱。 –

假設你的對象的數組是這樣的：

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

正如評論所指出的：someObject.toString()通常會返回[object Object]，所以它不是用於過濾什麼真正有用的。您可能預期會有一個JSON輸出，您可能使用的是JSON.stringify(someObject)，但更好和準確的方法是訪問該特定的鍵。

您可以修改功能類似如下：

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

    },

來源

2017-01-01 02:39:55 Saurabh

哇，這很甜！謝謝。所以我需要深入一層才能獲得我需要的特定密鑰？ –

@BernardParah'someObject.toString（）'通常會返回'[object Object]'，所以對於過濾任何東西都沒有用處。您可能預期會有一個JSON輸出，在這種情況下，您必須執行'JSON.stringify（someObject）'。但直接進入成員值是一種更好的方式。 – poke

感謝您的洞察！ @戳。 –

vue 2.0中的自定義過濾器不會返回任何內容

回答

相關問題