Quiero crear un blog simple donde las publicaciones se obtengan de https://jsonplaceholder.typicode.com/posts y los usuarios de https://jsonplaceholder.typicode.com/users , pero tengo el siguiente problema. Quiero mostrar el nombre del autor junto a la publicación, pero no sé cómo codificarlo. En pocas palabras, necesito usar IF del objeto JSON de la llamada a https://jsonplaceholder.typicode.com/posts y, de acuerdo con el resultado, mostrar el nombre del autor de la llamada a https://jsonplaceholder.typicode.com/users. . .

Aquí está la pieza de código relevante:

 import { useParams } from "react-router-dom"; import useFetch from "./useFetch"; const BlogDetails = () => { const { id } = useParams(); const { data: blog, error, isPending } = useFetch('https://jsonplaceholder.typicode.com/posts/' + id); return ( <div className="blog-details"> { isPending && <div>Loading...</div> } { error && <div>{ error }</div> } { blog && ( <article> <h2>{ blog.title }</h2> <p>Written by { blog.userId }</p> <div>{ blog.body }</div> <p>Comments: </p> </article> )} </div> ); } export default BlogDetails;

El código completo está aquí: https://github.com/qubit4/react_blog

¿Qué debo poner en "Escrito por: { }" en lugar de "blog.userId" para que funcione?