Archivo de contenido.js
import React from 'react'; const Content = () => { console.log('content called'); return (<div>Content</div>); }; export default Content;archivo app.js
import React from 'react'; import Content from './Content'; const App = () => { const isUserAuthenticated = false; return ( <div> { isUserAuthenticated ? <Content/> : <></> } </div> ); } export default App;Aunque la condición sea falsa, el componente de contenido se carga y se ejecuta console.log.
¿Es porque he importado el archivo? Sin embargo, no veo el HTML agregado al DOM.
¿Puedes probar esto en tu App.js :-
import React from 'react'; import Content from './Content'; const App = () => { const isUserAuthenticated = false; return ( <div> {isUserAuthenticated && <Content/>} </div> ); } export default App;También continuaría y diría que lo está usando en otro lugar y no lo ha notado. ¡Revisa tu código!
Coloqué este sandbox muy rápido para comprobarlo por mí mismo, y el renderizado condicional funciona como se esperaba.
Compruebe si lo desea.