不完全确定，但在我的情况下，我把这个

data?.comments && data?.comments?.map((val, id) => { 
....
....
}

如果data.comments为真，则将渲染Map

您得到的错误很可能是因为注解未定义。
要解决此问题，您可以使用&&运算符，仅在定义了注解的情况下尝试访问Map方法。如下所示：

{data && data.comments.map((val, id) => {
    return (
         <div className='comment-section' key={id}>
              <span style={{ color: 'gray' }}><b>{val.username}</b></span>
              <span> {val.comment}</span>
         </div>
    )

})}

这样，只有在定义了注解的情况下才会调用map方法，这应该可以防止错误发生。