JS 中的条件语句在以下代码中不起作用

Question

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;
};

The above code seems to be not working for condition based link to display on UI for "Condition policy" even though I get "true" for "myCondition" in the console log which is just logged before the return statement. Wondering What's wrong here. Any help is really appreciated.

Answer 1

It looks like you put a statement immediately after your if() statement, and so your block of code within {... } is not executed as part of your if statement.

if(someOtherCondition)
    console.log('', myCondition);
  {
    return(

The curly braces must follow immediately after the if() statement, otherwise, as it is in this case, the console.log is executed when someOtherCondition is true. And whatever is within {... } is executed anyway regardless.

Answer 2

Please check the below link, If you are something is not right, then please comment.

https://playcode.io/873851/

• If you put a condition without { just after the if statement, then the rest of the code does not depend on the condition.

Answer 3

Your if statement syntax is wrong