DEV Community

masia
masia

Posted on • Edited on

1

Operadores lógico vs ternario en react

El titulo tal vez sea vago, pero basicamente estas en una vista, usando un falsy/truthy con renderizado condicional && y ves un 0 colado.
ejemplo: {count && <div>Más de cero</div>}
Image description
Depende del contexto queras que aparezca el 0, ejemplo: un carrito de articulos, pero la mayoria es solo para mostrar o no mostrar x o y componente.

Habra gente que diria q usar operadores logico es mala practica, y que deberia usar un ternario, usando el anterior codigo de ejemplo: {count ? <div>Más de cero</div> : null} esto funciona, pero si lo ves muy verboso escribir, agregar null y a veces peor si vas a insertar otro ternario dentro de otro ternario, haciendo que sea mucho mas dificil de leer y en algunos casos aumentar la carga cognitiva.

¿Cual usarias un operador logico o ternario? Siguiendo la regla del yingyang ☯️ ambas dependiendo del caso, si vas a usar un falsy/truty en un operador logico para mostrar un elemento en react mayoria de los casos castearlo a un boolean ( da igual el metodo doble bang !! o el metodo Boolean() ) asi te aseguras q si el falsy es un number 0 no se mostrara en pantalla y si quieres mas explicito o no quieres castearlo usa un ternario como el ejemplo anterior donde falsy retorna null.

Top comments (0)

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay