reactjs 错误:无法读取null的属性(阅读'map')[已关闭]

42fyovps  于 2023-02-08  发布在  React
关注(0)|答案(1)|浏览(162)

18小时前关门了。
Improve this question

<div className="flex flex-col md:flex-row gap-y-2 md:gap-x-2 items-center">
            {post.categories.map((category) => (
              <div className="bg-[#f7ab0a] text-center text-black px-3 py-1 rounded-full text-sm font-semibold">
                <p>{category.title}</p> 
              </div>
            ))}
          </div>

enter image description here
我试图从我的模式中添加一些类别标签到我的博客上,但我一直得到这个错误。有人知道如何解决这个问题吗?

sd2nnvve

sd2nnvve1#

当你从某种服务器上获取数据时,可能会发生这种情况,而在组件的初始渲染时,数据还没有被接收到,因此此时你没有任何东西可以Map。处理这种情况的方法是,在迭代之前,确保你有数据。下面是你的方法:

{post?.categories?.map((category) => (
   ...
 ))}

或者,您可以测试数组长度,如下所示:

{post.categories.length && post.categories.map((category) => (
   ...
 ))}

相关问题