首頁(yè) 猿問(wèn) 檢查 JSON...

檢查 JSON 是否在返回中多次包含子元素

JavaScript

ibeautiful 2023-11-02 21:51:24

我正在嘗試在循環(huán)遍歷 JSON 子元素之前檢查它們的長(zhǎng)度（或者是否存在）。我的例子有一個(gè)注釋?zhuān)簕const itHasChildren = item.child_items.length;}我上面得到的錯(cuò)誤是src/Components/HeaderComponent/header.js 第 60:29 行：“childItem”未定義 no-undef搜索關(guān)鍵字以了解有關(guān)每個(gè)錯(cuò)誤的更多信息。 return ( <nav > <ul className="navbar-nav"> {menus && menus.map((item) => ( <li className="nav-item active" key={item.ID}> <Link >{item.title} </Link> // I NEED TO CHECK THE LENGTH OR IF child_items EXISTS // HERE SO I CAN DECIDE WHETHER TO DISPLAY THIS DIV OR NOT {item.child_items.map((childItem).length)} <div className="dropdown-menu" aria-labelledby="navbarDropdownMenuLink" > {item.child_items && item.child_items.map((childItem) => ( <Link >{childItem.title} </Link> ))} </div> </li> ))} </ul> </nav> );

查看完整描述

2 回答

撒科打諢

TA貢獻(xiàn)1934條經(jīng)驗(yàn) 獲得超2個(gè)贊

我已經(jīng)清理了你的代碼，所以它應(yīng)該可以工作。只是地圖內(nèi)的第一個(gè)元素需要，key根據(jù)您的數(shù)據(jù)，它可能是數(shù)組中的索引位置

return (

<button

className="navbar-toggler"

type="button"

data-toggle="collapse"

data-target="#navbarNavDropdown"

aria-controls="navbarNavDropdown"

aria-expanded="false"

aria-label="Toggle navigation"

>

</button>

{(menus || []).map((item, ix) => (

<Link

className="nav-link"

to={{

pathname: item.slug,

state: {

pageId: item.slug

}

}}

>

{item.title}

</Link>

{(item.child_items || []).map((childItem, ix) => (

<Link

className="dropdown-item"

to={{

pathname: childItem.slug,

state: {

pageId: childItem.slug

}

}}

>

{childItem.title}

</Link>

</div>

))}

</li>

))}

</ul>

</div>

</nav>

);

反對(duì) 回復(fù) 2023-11-02

幕布斯7119047

TA貢獻(xiàn)1794條經(jīng)驗(yàn) 獲得超8個(gè)贊

這是我正在尋找的語(yǔ)法和條件

<li 
            className={
                item.child_items
                  ? "nav-item dropdown"
                  : "nav-item  "
              }

反對(duì) 回復(fù) 2023-11-02