时间戳

首页 > 解决方案 > 数组 - 为什么即使它们（对我而言）看起来相同，也可以使用一个项目而不是另一个？

javascript - 数组 - 为什么即使它们（对我而言）看起来相同，也可以使用一个项目而不是另一个？

问题描述

这有效：

<div className='card'>
      <div className='card-inner'>
        <div className='card-front'>
          <img src={item.images[0].url} alt='Park Image' />
        </div>
        <div className='card-back'>
          <h1>{item.fullName}</h1>
          <ul>
  

  <li>
          {item.description}
        </li>
        <li>
          
        </li>
        <li>
        
        </li>
        <li>
        <a href = {item.url}>Park Website</a>
        </li>
      </ul>
    </div>
  </div>
</div>

但是，当我添加 {item.entranceFees[0].description}

<div className='card'>
      <div className='card-inner'>
        <div className='card-front'>
          <img src={item.images[0].url} alt='Park Image' />
        </div>
        <div className='card-back'>
          <h1>{item.fullName}</h1>
          <ul>
            <li>
              {item.description}
            </li>
            <li>
              
            </li>
            <li>
            {item.entranceFees[0].description}
            </li>
            <li>
            <a href = {item.url}>Park Website</a>
            </li>
          </ul>
        </div>
      </div>
    </div>

它似乎打破了。Chrome 告诉我“TypeError：无法读取未定义的属性‘描述’” chrome screenshot

api截图

我真正感到困惑的是 item.images[0].url 似乎工作正常，我可以从返回的内容中提取图像。

有人可以向我解释一下吗？非常感谢。

标签： javascriptarraysreactjsapi

解决方案

TypeError: Cannot read property 'description' of undefined表示item.entranceFees[0]is undefined，即item.entranceFees是一个空数组或没有0属性的函数/对象。

好消息是我们可以确定item.entranceFees存在。所以从那里调试。

例如：{(item.entranceFees[0] || {}).description || "Oops, no entrance fees."}

推荐阅读