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

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 的一个 prop。 "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>

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

Can't access values when mapping over in next.js / react

javascript

arrays

json

reactjs

next.js