在 next.js / react 中映射时无法访问值

Question

您好，我有一些 json，无法访问其中的特定值。这是出错的代码：

 const Index = props => (
 <Layout>
 <h1>Case Studies</h1>

 <ul>
   {props.caseStudies.map(({ caseStudy }) => (
     <a>{caseStudy.title}</a>
   ))}
 </ul>

</Layout>
);

我得到的错误是

Cannot read property 'title' of undefined

但是，如果我删除：

{caseStudy.title} 

对于上面的代码块，我可以在 Chrome 的 React Inspector 工具中看到“caseStudies”是 Index 的一个属性。而“title”是 caseStudies 道具中的一个键。我似乎无法访问它！

这是有问题的 json：

{
"status": "ok",
"sets": {
    "caseStudies": [
        {
        "_id": "1",
        "title": "Case Study Item One",
        "_title": "Case Study Item One",
        "date": "2018-06-01"
        }
    ]
 }
}

谢谢。

Answer 1

你的语法有点错误：

<ul>
  {props.caseStudies.map((caseStudy ) => (   // note the removed {}
    <a>{caseStudy.title}</a>
  ))}
</ul>