在 react 組件中，有一個用于發表評論的表單。當我發表評論時，它會被提交并出現在資料庫中。使用地圖功能，我試圖在瀏覽器上顯示博客評論，但它只是沒有出現在瀏覽器上。我可以在 redux devtools 中看到一系列注釋。
<Container className="content">
<div>
<h1 className='display-2'>{blog.title}</h1>
<Image src={blog.image} />
<h2 className='text-muted mt-3'>Category: {blog.category}</h2>
<div className='mt-5 mb-5' dangerouslySetInnerHTML={createBlog()} />
</div>
<div>
{blog?.post?.comments.length === 0 && <Message variant='info'>No comment yet</Message>}
<div>
{blog?.post?.comments.map((comment) => (
<div key={comment?.id}>
<strong>{comment?.name}</strong>
<p>{comment?.dateCreated.substring(0, 10)}</p>
<p>{comment?.comment}</p>
</div>
))}
</div>
{blogCommentLoading && <Loader />}
{blogCommentSuccess && <Message variant='success'>Comment Submitted</Message>}
{blogCommentError && <Message variant='danger'>{blogCommentError}</Message>}
<Form onSubmit={submitHandler}>
<Form.Group controlId='comment'>
<Form.Label>Comment</Form.Label> {/* The label called review is named comment in the database(backend)*/}
<Form.Control
as='textarea'
row='5'
value={comment}
onChange={(e) => setComment(e.target.value)}
></Form.Control>
</Form.Group>
<Button type='submit' variant='primary'>Submit</Button>
</Form>
</div>
</Container>
);
};
我錯過了什么，如何讓評論出現在瀏覽器上？
uj5u.com熱心網友回復：
代替
{blog?.post?.comments.length === 0 && <Message variant='info'>No comment yet</Message>}
<div>
{blog.post.comments.map((comment) => (
<div key={comment?.id}>
<strong>{comment?.name}</strong>
<p>{comment?.dateCreated.substring(0, 10)}</p>
<p>{comment?.comment}</p>
</div>
))}
</div>
和：
{!blog?.post?.comments?.length ? (
<Message variant='info'>No comment yet</Message>
) : (
<div>
{blog?.post?.comments.map((comment) => (
<div key={comment?.id}>
<strong>{comment?.name}</strong>
<p>{comment?.dateCreated.substring(0, 10)}</p>
<p>{comment?.comment}</p>
</div>
))}
</div>
)}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/412524.html
標籤：