ES6 conditional if statement to check if arrays are empty [duplicate]

问题

This question already has an answer here:

way to embed if expressions inside JSX code? (1 answer)

Closed 4 years ago.

I can't seem to get my jsx es6 react if statement to work.. What am I doing wrong?

const otherVariables = doesntMatter;    

return (
...
    <div>
    {if (props.student.length == null && props.teacher.length == null) => (
       <p>empty</p>
    ) : (
       <p>not empty</p>
    )} 
   </div>
...
)

How can i check if both arrays are empty?

回答1:

There is a syntax error, you are testing an lambda expression.

You can do something like

return !!props.student.length && !!props.teacher.length ? <p>not empty</p> : <p>empty</p>;

回答2:

const elementToRender = props.student.length && props.teacher.length ?  <p>not empty</p> : <p>empty</p>

And then in the jsx just do:

<div>
  { elementToRender }
</div>

来源：https://stackoverflow.com/questions/37327681/es6-conditional-if-statement-to-check-if-arrays-are-empty