javascript - 如何在反应中过滤对象？

Question

这是我的问题，在第一张照片中。我映射了我的对象，它正确显示了我的对象，我只想过滤包含名称 beers 的项目。

    let addedItems = this.props.items.length ?
    (      
        this.props.items.map(item => {
        return (
            <div className="homeProduct">
                    <Media  >
                        <Media body className="mediaBodyContainerHome">
                            <div className="mediaBodyTitle">
                                <Media heading className='MediaTextHome'>
                                    {item.title}
                                </Media>
                            </div>

                        </Media>
                    </Media>

我给你看我的桌子

     const initState = {

items: [
    {id:1,title: "Hype PA (Demi-Pinte)",  ctg: "beers", },
    {id:2,title:'Fuso jaune - kombucha',  ctg: "cocktail",},
    {id:3,title:'Tartinades Terre d\'Apéro', ctg: "planches",},  
],

addedItems:[],
}

标签： javascriptreactjs

Answer 1

你可以这样做：

let addedItems = this.props.items.length ?
    (      
        this.props.items.filter(item => item.ctg==="beers").map(item => {
        return (
            <div className="homeProduct">
                    <Media  >
                        <Media body className="mediaBodyContainerHome">
                            <div className="mediaBodyTitle">
                                <Media heading className='MediaTextHome'>
                                    {item.title}
                                </Media>
                            </div>

                        </Media>
                    </Media>
            <div>
    ) : "Another rest condition"