Javascript 如何根据react中的类别筛选数组？
我正在学习React，并试图找出如何根据类别过滤数组 我处理的数据如下所示： 因此，我可以使用以下方法筛选出所有类别：Javascript 如何根据react中的类别筛选数组？,javascript,reactjs,ramda.js,Javascript,Reactjs,Ramda.js,我正在学习React，并试图找出如何根据类别过滤数组 我处理的数据如下所示： 因此，我可以使用以下方法筛选出所有类别： getTheCats() { const cats = [...new Set(this.getVehicleData().map(v => v.category))]; const catsR = cats.filter(c => c).map((category, i) => { // console.log(this.p
getTheCats() {
const cats = [...new Set(this.getVehicleData().map(v => v.category))];
const catsR = cats.filter(c => c).map((category, i) => {
// console.log(this.props.vehicle);
return (
<Col
xs="12"
key={i}
onClick={() => this.getCategories(category)}
className={
this.state.category === category
? 'border-bottom p-15 active'
: 'border-bottom p-15 not-active'
}
>
<FontAwesomeIcon
icon={this.state.active ? faMinusCircle : faPlusCircle}
/>
<h5 className=""> {category} </h5>
<SpecsDetails
key={this.props.vehicle.id}
vehicle={this.props.vehicle}
/>
</Col>
);
});
return (
<Row className="deal-details__specs accoridon-heading" id="specs">
{catsR}
</Row>
);
}
实际上，您可以通过一些对象技巧来实现这一点
let categories = {};
this.getVehicleData().map(vehicle => {
categories[vehicle.category] = categories[vehicle.category] || []
categories[vehicle.category].push(vehicle)
})
Object.keys(categories).map(category => {
console.log('category', category)
console.log('values', categories[category])
})
希望这能起作用：您可以通过一些对象技巧来实现这一点
let categories = {};
this.getVehicleData().map(vehicle => {
categories[vehicle.category] = categories[vehicle.category] || []
categories[vehicle.category].push(vehicle)
})
Object.keys(categories).map(category => {
console.log('category', category)
console.log('values', categories[category])
})
希望这能奏效：代码示例看起来被截断了；现在还不清楚如何计算catsR。如果您感兴趣，这里有一个替代使用Set计算唯一类别列表的方法：const categories=composeuniq，mapprop'category'。很抱歉。是的，它被截断了。catsR只返回我的组件的其余部分，然后我渲染它。我已经用剩下的代码更新了这个问题；现在还不清楚如何计算catsR。如果您感兴趣，这里有一个替代使用Set计算唯一类别列表的方法：const categories=composeuniq，mapprop'category'。很抱歉。是的，它被截断了。catsR只返回我的组件的其余部分，然后我渲染它。我已经用剩下的代码更新了这个问题。@ScottSauyet-谢谢。我考虑过，但由于数据是在React中用于渲染的，所以我不确定它是否那么重要。我会把它作为一种选择。新年快乐：我倾向于在任何地方都这样做，即使这不是真的必要，以使我使用的结构更容易理解。但这里绝对有理由不这样做。欢迎。我喜欢这个，而且我相信@ScottSauyet知道更多的资源。克里斯托弗·奥克拉维在他的Youtube频道上广泛谈论拉姆达函数：->他一个接一个地讨论函数。我真的很喜欢兰迪·库尔曼的系列。@ScottSauyet-谢谢。我考虑过，但由于数据是在React中用于渲染的，所以我不确定它是否那么重要。我会把它作为一种选择。新年快乐：我倾向于在任何地方都这样做，即使这不是真的必要，以使我使用的结构更容易理解。但这里绝对有理由不这样做。欢迎。我喜欢这个，我相信@ScottSauyet知道更多的资源。克里斯托弗·奥克拉维在他的Youtube频道上广泛谈论拉姆达函数：->他一个接一个地讨论函数。我真的很喜欢兰迪·库尔曼的系列。