const myFunction = (props) => { let myCondition = false; console.log('-----****----',props); if(props && props.isAllowed) { myCondition = true; } if(someOtherCondition) { return( <li><Link className="vx_globalNav-links" to="#">Policies</Link> <ul> <li><Link className="vx_globalNav-links" to="/my-policy">My Policy</Link></li> { myCondition && (<li><Link className="vx_globalNav-links" to="/condition-policy">Condition Policy</Link></li>)} </ul> </li> ); } return null; };El código anterior parece no funcionar para que el enlace basado en la condición se muestre en la interfaz de usuario para la "política de condición" a pesar de que obtengo "verdadero" para "mi condición" en el registro de la consola que se registra justo antes de la declaración de devolución. Preguntándose qué está mal aquí. Cualquier ayuda es muy apreciada.
Parece que colocaste una declaración inmediatamente después de tu declaración if() , por lo que tu bloque de código dentro de { ... } no se ejecuta como parte de tu declaración if .
if(someOtherCondition) console.log('', myCondition); { return( Las llaves deben seguir inmediatamente después de la declaración if() , de lo contrario, como en este caso, el archivo console.log se ejecuta cuando someOtherCondition es verdadera. Y lo que sea que esté dentro de { ... } se ejecuta de todos modos, independientemente.
La sintaxis de su declaración if es incorrecta
Consulte el enlace a continuación, si algo no está bien, comente.
{ justo después de la instrucción if, el resto del código no depende de la condición.