Javascript NEXT.js同构取消蚀刻出错

我正在做下面的练习。我无法理解和适应的是，这个练习从中获取数据

数据如下：

[
 {"score":24,"show":{"id":975,"url":"", "name":""}}
,{"score":25,"show":{"id":976,"url":"", "name":""}}
,{"score":26,"show":{"id":977,"url":"", "name":""}}
]

索引页使用以下映射：

{props.shows.map(({show}) => (
        <li key={show.id}>
          <Link as={'/p/${show.id}'} href={'/post?id=${show.id}'}>
            <a>{show.name}</a>
          </Link>
        </li>
      ))}

相同的代码失败，出现错误：

Unhandled Rejection (TypeError): Cannot read property 'id' of undefined

---

因此，除此之外，它还有明显不同的数据结构。我不明白为什么，如果我的数据结构稍有不同，我该如何更改

props.shows.map

函数相应地更改？

你熟悉JS中的对象分解结构吗

在本例中，编写

（{show}）

是编写类似

（resp）

，然后再编写

show=resp.show

。因此在本例中，由于进行了分解，

show

已经是

show

对象。因此，

id

起作用

---

您的数据没有

show

属性，因此在分解结构时，

show

是未定义的。当然，您不能获得未定义的

属性。从
{show}
中删除花括号应该可以做到这一点。
没错。它成功了。很高兴你也解释了这是什么。
Unhandled Rejection (TypeError): Cannot read property 'id' of undefined