好像是在map函式中沒有輸入key值導致的錯誤,但是不知道怎么修改代碼。
該陣列的結構如下:
const tabContArr=[
{
tabTitle:(
<span className={activeIndex===0 ? "is-active" : ""} onClick={()=>tabClickHandler(0)}>0</span>
),
},
{
tabTitle:(
<span className={activeIndex===1 ? "is-active" : ""} onClick={()=>tabClickHandler(1)}>1</span>
),
},
{
tabTitle:(
<span className={activeIndex===2 ? "is-active" : ""} onClick={()=>tabClickHandler(2)}>2</span>
),
},
{
tabTitle:(
<span className={activeIndex===3 ? "is-active" : ""} onClick={()=>tabClickHandler(3)}>3</span>
),
}
];
地圖功能部分發生錯誤。
{tabContArr.map((section)=>{
return section.tabTitle
})}
uj5u.com熱心網友回復:
你所做的不是正確的方法。如果您有資料,則不應將 ReactElement 傳遞到陣列中,而應將其傳遞到 map 函式中,如下所示:
{tabContArr.map((tab, index)=>{
return <span
className={activeIndex === index ? "is-active" : ""}
onClick={()=>tabClickHandler(index)}
key={`tab-${index}`}>index</span>
})}
uj5u.com熱心網友回復:
嘗試使用React 檔案中提到的具有屬性的React Fragmentskey
{tabContArr.map((section, index)=>{
return <React.Fragment key={`section-tab-${index}`}>{section.tabTitle}</React.Fragment>
})}
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/359714.html
標籤:javascript 反应 反应键索引
