反应给我："类型错误：无法读取未定义的属性"，但无论如何都会发布

Question

为我的公司跳一个react项目，但我不是很熟悉它。我们有一个bug，当用户发布内容时，我们会得到这个错误，但如果你刷新，帖子仍然在那里。有提示吗?

TypeError: Cannot read properties of undefined (reading 'comment') 
src/Components/Main/Dispatch/DispatchDetails/DispatchDetails.tsx:1552
1549 | {   dispatch.comments &&
1550 |     dispatch.comments.map((story, index) =>
1551 |     <div key={index}>
> 1552 |         {story.comment.split('n').map((remark, indexRem) => {
1553 |             if(remark === '') {
1554 |                 return <br key={indexRem} />;
1555 |             }
src/Components/Main/Dispatch/DispatchDetails/DispatchDetails.tsx:1550
1547 | <h3 style={boldStyle}>Dispatch Comments:</h3>
1548 | <div className="well-story">
1549 |     {   dispatch.comments &&
> 1550 |         dispatch.comments.map((story, index) =>
1551 |         <div key={index}>
1552 |             {story.comment.split('n').map((remark, indexRem) => {
1553 |                 if(remark === '') {

<div className="well-story">
{   dispatch.comments &&
dispatch.comments.map((story, index) =>
<div key={index}>
{story.comment.split('n').map((remark, indexRem) => {
if(remark === '') {
return <br key={indexRem} />;
}
return <p key={indexRem} className="the-remark">{remark}</p>;
})
}
<p className="remark-datetime">
{story.commentBy + ' | ' + moment(story.commentDate, 'X').format('LLL')}
</p>
</div>
) }
</div>

Answer 1

故事第二循环因此这个错误对象为空在那里,因为第一循环故事对象好,加工精细,但是下一个对象是空的,因此显示一个错误。下面的代码应该解决你的问题。

<div className="well-story">
{   dispatch.comments &&
dispatch.comments.map((story, index) =>
<div key={index}>
{story && story.comment && story.comment.split('n').map((remark, indexRem) => {
if(remark === '') {
return <br key={indexRem} />;
}
return <p key={indexRem} className="the-remark">{remark}</p>;
})
}
<p className="remark-datetime">
{story.commentBy + ' | ' + moment(story.commentDate, 'X').format('LLL')}
</p>
</div>
) }
</div>