在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ React中使用map不能全部遍歷數(shù)組。

React中使用map不能全部遍歷數(shù)組。

使用map遍歷數(shù)組發(fā)現(xiàn)不能遍歷到數(shù)組最后一個元素。如果數(shù)組為空，map函數(shù)不執(zhí)行。

render() {

    console.log(this.props.items);
    var Items=this.props.items.map((i)=>{
        return <RecipeItem key={i} id={i} RemoveId={this.handleRemoveId.bind(this)} />
    });
    console.log(Items);
    return (
        <div id='itemcontainer'>
            {Items}
        </div>
    )
}

圖片描述

回答
編輯回答
萢萢糖

圖片描述

自己試驗了一下，查看chrome這個調(diào)試工具是在你點開對象的時候去獲取當(dāng)前對象內(nèi)容的，而不是打印的時候，所以console中打印的比較準(zhǔn)確的是對象的摘要信息（也就是可以點擊展開的那個），比如上圖中的[] 和 (3)[{...},{...},{...}] 分別代表數(shù)組里面對象個數(shù)為0和3.

2017年7月10日 11:20
編輯回答
荒城

已經(jīng)解決。后來仔細(xì)調(diào)試之后發(fā)現(xiàn)其實是由于this.props.items數(shù)組有元素，但長度為0.同這個問題鏈接描述

2017年9月18日 09:38
編輯回答
胭脂淚

應(yīng)該是父組件后來給items添加的元素，console.log的不一定是執(zhí)行時候的數(shù)據(jù)，可以看下items的獲取

2018年7月1日 14:11
編輯回答
心夠野
render() {
    return (
        <div id='itemcontainer'>
            {
                this.props.items.length>0 && this.props.items.map((i)=>{
                   return( <RecipeItem key={i} id={i} RemoveId={this.handleRemoveId.bind(this)}/>)
               }
        </div>
    )
}
2018年4月30日 06:23