Reactjs (Functional Component) 带 OR 语句的条件渲染

Question

const App = () =>{
    const condition1 = true
    const condition2 = false
    return (
        <div>
            {condition1 || condition2 && <h1>condition met</h1>}
        </div>
    )
}

上面的代码只关心condition2，condition1被忽略了。 有没有办法在我的 jsx 中使用 OR 运算符？ 我也试过浏览这个 https://reactjs.org/docs/conditional-rendering.html 但找不到我要找的东西。

Answer 1

也许你忘了加括号？

const App = () =>{
    const condition1 = true
    const condition2 = false
    return (
        <div>
            {(condition1 || condition2) && <h1>condition met</h1>}
        </div>
    )
}