javascript - 访问对象数组中的值

Question

代码

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"}]

Answer 1

我已经尝试过您的jsfiddle代码。您将 props.thumbnails 初始化为错误的格式。查看第 23 行。这就是初次调用时 props.thumbnails 迭代的结果。这就是为什么您收到错误未定义。

更改代码

sharedThumbs: [{ thumbnail_url: '' }],

至

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