Question

我试图用React JS创建搜索。

我有一个阵列（汽车），我想通过它搜索。我有一系列过滤器（在这种情况下是一个）我需要应用。最后我得到了那个过滤器的内容。

因此我有三个对象数组：

汽车（所有汽车列表）。它看起来如下：

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

收藏夹（该过滤器的内容）：

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

渲染功能如下：

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'));

因此，我想搜索汽车，并应用所有过滤器（在这种情况下只有一个）并获得结果。

因此，在这种情况下，结果应为：

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

但是凭我的代码，我什么都没得到。

有什么建议吗？

Here is fiddle.

Answer 1

您在询问car对象是否与every中filter的{{1}}值匹配。我认为你写的是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);

使用另一个数组过滤数组

1 个答案: