下面是一个内联 if 与逻辑 && 运算符，它渲染一个组件 ifthis.state.isHidden是假的。
<div>{!this.state.isHidden && <ShowThisComponent /> }</div>
上面的行按预期工作。我的问题是我无法弄清楚如何在上面的行中添加要满足的第二个条件（例如 var1 === var2）。因此，如果两者都返回 true，则将显示该组件。我怎样才能做到这一点？谢谢
我查看了文档（https://reactjs.org/docs/conditional-rendering.html#inline-if-with-逻辑-ampamp-operator https://reactjs.org/docs/conditional-rendering.html#inline-if-with-logical-ampamp-operator）找不到答案
这就是运算符的工作原理：
{<any boolean statement> && <Component-to-be-displayed />}.
-or-
{(<any boolean statement>) && <Component-to-be-displayed />}...在分析布尔语句时使用括号总是一个好主意
在你的情况下，它看起来像这样：
(!this.state.isHidden && var1 === var2) && <Component-to-be-displayed />
所以想像这样的运算符：
if 条件为 true && 渲染组件
您还可以执行 if 语句：
{(<any boolean statement>) ?
<Component-to-be-displayed-if-true />
:
<Component-to-be-displayed-if-false />
}
你可以这样想这个运算符：
如果条件为真？渲染组件 A ：否则渲染组件 B
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
