Utilização do operador && em JSX

Pode ser necessário inserir um texto se uma condição for verdadeira, e não fazer nada se for falsa. Isso é feito usando o operador &&.

Vamos ver seu funcionamento com um exemplo. No código a seguir, se show for true, um parágrafo com o texto será inserido, e se for false, nada será inserido:

jsxfunction App() {
  const show = true;
  
  return <div>
    {show && <p>text</p>}
  </div>;
}

jsxfunction App() {
  const isAuth = true;
  
  return <div>
    <p>você está autenticado</p>
  </div>;
}