javascript - react : inline if condition then display this div

Question

我可以创建一个基于常量的 React 组件。

const MyComp = (prop) => ... etc

其中我有一些 JSX:

<div id="myDiv">
        Stuff Here
</div>

我有一个名为 myprop 的 prop 当前为真。

所以我想在 myDiv 中添加一个条件...例如:

<div id="myDiv" {if myprop === true}>
        Stuff Here
</div>

只有当 prop 为真时，div 才会显示。

我如何在 React 中执行此操作？

Answer 1

如果我正确理解你的问题，那么这应该可以通过以下 JSX 语法实现:

{ (myprop === true) && <div id="myDiv">
        Stuff Here
   </div>
}

总结一下正在发生的事情，这实际上是一个表达式，“if myprop === true” then “render the div”