🔗 Conditional rendering – React Docs

✅ ¿Qué quiere enseñarte React en esta sección?

Cómo mostrar u ocultar elementos en JSX de forma condicional usando expresiones booleanas, ternarios, lógica previa o retorno temprano.

🧠 Párrafo resumen:

“En React, el renderizado condicional te permite mostrar u ocultar elementos según una condición. Podés usar operadores ternarios, expresiones booleanas, retornos anticipados o lógica previa para decidir qué renderizar. Esto permite adaptar la UI dinámicamente según los datos.”

📌 Técnicas que React quiere que sepas:

  1. Ternario en JSX 
{isLoggedIn ? <LogoutButton /> : <LoginButton />}
  1. Renderizar solo si es verdadero (corte booleano) 
{isNew && <p>Bienvenido/ap>}
  1. Return anticipado dentro del componente 
if (!isLoggedIn) return <LoginScreen />;
  1. Guardar lo que vas a renderizar en una variable previa 
let contenido;
if (error) {
  contenido = <Error />;
} else {
  contenido = <Dashboard />;
}
return <div>{contenido}div>;