Actualmente estoy siguiendo un tutorial sobre la pila PERN y cada vez que intento imprimir el contenido de una matriz en la pantalla para que esté bajo el título y el contenido , no se imprime nada.

Aquí está mi código donde el error se encuentra en algún lugar dentro de:

 import React, { Fragment, useState, useEffect } from "react"; const ListBlog = () => { const [blogs, setBlogs] = useState([]); const getBlogs = async () => { const res = await fetch('http://localhost:5000/blog'); const blogArray = await res.json(); setBlogs(blogArray) } useEffect(() => { getBlogs(); }, []) console.log(blogs) return <Fragment> {" "} <table className="table mt-5"> <thead> <tr> <th>Title</th> <th>Content</th> <th>Edit</th> <th>Delete</th> </tr> </thead> <tbody> {/* <tr> <td>John</td> <td>Doe</td> <td>john@example.com</td> </tr>*/} { blogs.map(blog => { <tr> <td> {blog.title} </td> <td>{blog.content}</td> <td>Edit</td> <td>Delete</td> </tr> }) } </tbody> </table> </Fragment> } export default ListBlog;

Creo que el estado está causando errores ya que está imprimiendo lo siguiente:

 (2) [{…}, {…}]0: {post_id: 1, title: 'hi', content: 'howdy'}1: {post_id: 11, title: 'eat', content: 'yogurt'}length: 2[[Prototype]]: Array(0) [object Object],[object Object]

Solo quiero imprimir la matriz, pero por alguna razón [Object object] también se está imprimiendo, lo que puede estar causando que mi contenido no se imprima en mi página localhost.

Así es como se ve mi página cuando trato de que mis contenidos dentro de la matriz se impriman debajo de title , content , Edit y Delete pero no se muestra nada...