Question

在我的react应用中，我正在映射如下数组

{(newdata !== null) ? newdata && newdata.map((item,key) => {
       console.log("item ",item);
         return (
            <div>{item.image_location}</div>
         )
    }
 ):null
}

我的控制台日志如下

但是不能在项目对象中反对image_location属性或任何其他属性。我尝试了item.image_location，但返回了undefined。如何访问我的item对象内部的属性

我试图这样访问

const newkey = parseInt(key)+1; console.log("item ",item.$['place_'+newkey]);

仍然出现未定义的错误

最新代码

{(newdata !== null) ? newdata && newdata.map((item, key) => {
                        var newkey = parseInt(key) + 1;
                        console.log("item ", item['place_' + newkey]);
                        return (

                            <Row noGutters className="container_one polaroid unchange_div" key={key}>

                                <Col xs={4} className="attraction_container">
                                    <img src={item.image_location} alt="img"
                                         className="attraction_img"/>
                                </Col>

                            </Row>
                        )
                    }) : (countrydata === null && loading === false) ?
                        <div className="horiz_center"><span className="nodata_lbl">No data</span>
                        </div> : null
                    }

Answer 1

在日志中，您可以清楚地看到image_location属性包装在place_1属性内。因此，您必须像item.place_1.image_location

那样访问它

更新

{(newdata !== null) ? newdata && Object.keys(newdata).sort((a,b) => parseInt(a.split('_')[1]) - parseInt(b.split('_')[1])).forEach((key) => {
    console.log("item ", newdata[key]);
    return (
      <Row noGutters className="container_one polaroid unchange_div" key={key}>
        <Col xs={4} className="attraction_container">
          <img src={newdata[key].image_location} alt="img" className="attraction_img"/>
        </Col>
      </Row>
    )
  }) : (countrydata === null && loading === false) ? 
      <div className="horiz_center"><span className="nodata_lbl">No data</span>
    </div> : null
}

无法访问对象内部的属性

1 个答案: