×TypeError: Cannot read properties of undefined (reading 'map')

原代码：

  <div className="content">
    <h2>{goodPriceInfo.title}</h2>
    <ul>
      {
      goodPriceInfo.list.map(item=>{
        return <li key={item.id}>{item.name}</li>
      })
      }
    </ul>
  </div>

报错信息如下：

TypeError: Cannot read properties of undefined (reading 'map')

原因是调用map的对象时,其初始化第一次渲染时异步数据为undefined。

解决方案：&&或者？

    <div className="content">
    <h2>{goodPriceInfo.title}</h2>
    <ul>
      {
       goodPriceInfo?.list?.map(item=>{
        return <li key={item.id}>{item.name}</li>
      })
      }
    </ul>
  </div>
</div>

        <div className="content">
          <h2>{goodPriceInfo.title}</h2>
          <ul>
            {goodPriceInfo &&
              goodPriceInfo.list &&
              goodPriceInfo.list.map((item) => {
                return <li key={item.id}>{item.name}</li>;
              })}
          </ul>
        </div>