从对象数组中访问值

时间:2018-02-07 14:21:58

标签: javascript reactjs foreach jsx

props.thumbnails.forEach(value=>{
        console.log(value.photo.thumbnail_url);
    })

错误

TypeError: Cannot read property 'thumbnail_url' of undefined

当我尝试

props.thumbnails.forEach(value=>{
        console.log(value.photo);
    })

响应

{owner: 7, thumbnail_url: "images/CACHE/images/barack_obama-2/888e0a85a1c0244831ec95e6a6716347.jpg", created_at: "2018-02-07"}
{owner: 7, thumbnail_url: "images/CACHE/images/170622210800-barack-obama-file-full-169/2560197d333c86930614c29755ef5237.jpg", created_at: "2018-02-07"}

我正在尝试从数组内部的照片中获取thumbnail_url。但我无法做到这一点。有人可以帮我这个吗?

更新: 我试试这个时

console.log(props.thumbnails[0].photo)

结果

{owner: 7, thumbnail_url: "images/CACHE/images/barack_obama-2/888e0a85a1c0244831ec95e6a6716347.jpg", created_at: "2018-02-07"}

更新2: 代码

console.log(JSON.stringify(props.thumbnails))

结果

[{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/barack_obama-2/888e0a85a1c0244831ec95e6a6716347.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/170622210800-barack-obama-file-full-169/2560197d333c86930614c29755ef5237.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/barack_obama-2_4xWOj4h/8ff56440afd36924b5c4f4edc34e0abf.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/bck/3dc4db87dc07448888be58dc34ed7be0.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/barack_obama-2_RtQE7Dh/8b308f5d48591b1cd14141a68ddd0aa5.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/obama_rEmzr6f/5c7e1a1698c28f9d03a3c3f0f28b430d.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":7,"thumbnail_url":"images/CACHE/images/President_Barack_Obama_mpU4fZP/1712b21906092dd6931d76604f20874a.jpg","created_at":"2018-02-07"},"tag":"6"},{"photo":{"owner":6,"thumbnail_url":"images/CACHE/images/obama_d7uqGPL/b75e7e2bca6c3189303c307aed640b96.jpg","created_at":"2018-02-07"},"tag":"6"}]

2 个答案:

答案 0 :(得分:1)

我已尝试过您的jsfiddle代码。您已将props.thumbnails初始化为错误的格式。看看line 23。这是初始调用时props.thumbnails的迭代。这就是为什么你得到错误 undefined

更改代码
sharedThumbs: [{ thumbnail_url: '' }],

sharedThumbs: [{ photo:{ owner:0, thumbnail_url: '' } }],

答案 1 :(得分:-1)

而不是使用foreach使用props.thumbnails.map(thumbail => {});

props.thumbnails.map(thumbnail => console.log(thumbnail));