2016-12-07 10 views
1

React JSで検索を作成しようとしています。別の配列で配列をフィルタリングする

私は検索したいアレイ(車)が1つあります。私は適用する必要があるフィルタの配列(この場合は1つ)を持っています。そして最後に、私はそのフィルタの内容を持っています。

  • 車(すべての車のリスト):

    は、私は、オブジェクトのように3つの配列を持っています。

    let filters = [ 
         {"name":"FAVORITES","values":[  
               {"carID":21,"listID":3,"userID":12}, 
               {"carID":22,"listID":3,"userID":12} 
              ] 
         } 
    ]; 
    
  • お気に入り(そのフィルタの内容):

    - (この場合には1つのフィルタのみがあるすべてのフィルタを持つ配列)

    let cars = [ 
        {"id":20,"listID":3,"make":"Golf"}, 
        {"id":21,"listID":3,"make":"Passat"}, 
        {"id":22,"listID":3,"make":"Audi"}, 
        {"id":23,"listID":3,"make":"Touran"}, 
        {"id":24,"listID":3,"make":"Touran"} 
    ]; 
    
  • フィルタを次のように見えます

レンダリング機能は次のとおりです。

render(){ 
    return cars.filter(car => filters.every(filter => filterItem(filter, car))) 
} 

このように、すべての車にフィルタを適用し、すべてのフィルタを適用し、すべての車とすべてのフィルタに対してfilterItem関数を呼び出します。次のように

と(私は結果を取得しようとしている)filterItem機能は次のとおりです。

function filterItem(filter, car) { 
    switch(filter.name) { 
     case "FAVORITES": 
       return filter.values.map(f => f).every(v => car.id === v.carID && car.listID === v.listID); 
     default: 
      return true; 
    } 
} 

このすべて一緒に一つの成分で:

let favorites = [ 
    {"carID":21,"listID":3,"userID":12}, 
    {"carID":22,"listID":3,"userID":12} 
]; 


let cars = [ 
    {"id":20,"listID":3,"make":"Golf"}, 
    {"id":21,"listID":3,"make":"Passat"}, 
    {"id":22,"listID":3,"make":"Audi"}, 
    {"id":23,"listID":3,"make":"Touran"}, 
    {"id":24,"listID":3,"make":"Touran"} 
]; 

let filters = [ 
    {"name":"FAVORITES","values":[ 
           {"carID":21,"listID":3,"userID":12},  
           {"carID":22,"listID":3,"userID":12} 
           ] 
    } 
] 

function filterItem(filter, car) { 
    switch(filter.name) { 
     case "FAVORITES": 
      return filter.values.map(f => f).every(v => car.id === v.carID && car.listID === v.listID); 
     default: 
      return true; 
    } 
} 

class Test extends React.Component { 
    render(){ 
     return (
     <div> 
      {cars.filter(car => filters.every(filter => filterItem(filter, car)))} 
     </div> 
    ) 
    } 
} 

React.render(<Test />, document.getElementById('container')); 

したがって、私は車を検索したいですすべてのフィルタを適用し(この場合は1つだけ)、結果を取得します。

したがって、この場合には、結果は次のようになります。

let results = [ 
    {"id":21,"listID":3,"make":"Passat"}, 
    {"id":22,"listID":3,"make":"Audi"} 
] 

しかし、私のコードで私は何を取得。

アドバイスはありますか?

Here is fiddle.

答えて

2

carオブジェクトはそれを行うことはできませんfilterの値のeveryを、一致した場合は、求めています。あなたが書こうとしていたのは、someです。 someは、車内ののいずれかの値にが一致するかどうかを確認します。たとえば:

let favorites = [ 
 
    {"carID":21,"listID":3,"userID":12}, 
 
    {"carID":22,"listID":3,"userID":12} 
 
]; 
 

 

 
let cars = [ 
 
    {"id":20,"listID":3,"make":"Golf"}, 
 
    {"id":21,"listID":3,"make":"Passat"}, 
 
    {"id":22,"listID":3,"make":"Audi"}, 
 
    {"id":23,"listID":3,"make":"Touran"}, 
 
    {"id":24,"listID":3,"make":"Touran"} 
 
]; 
 

 
let filters = [ 
 
    {"name":"FAVORITES","values":[ 
 
     {"carID":21,"listID":3,"userID":12},  
 
     {"carID":22,"listID":3,"userID":12} 
 
    ] 
 
    } 
 
] 
 

 
function filterItem(filter, car) { 
 
    switch(filter.name) { 
 
     case "FAVORITES": 
 
      return filter 
 
       .values 
 
      // Here, we change `every` to `some`, since a car has to match only ONE value 
 
       .some(v => car.id === v.carID && car.listID === v.listID); 
 
     default: 
 
      return true; 
 
    } 
 
} 
 

 
var favFilter = filterItem.bind(null, filters[0]); 
 
var filteredCars = cars.filter(favFilter); 
 
console.log(filteredCars);

+0

私はすでにそれを解決しました。それが解決策です。 :) 、 とにかくありがとう。 – Boky

関連する問題