Gatsby条件渲染组件

Question

我有一个像这样的模板：

const Template = ({ data }) => {
  const { id } = data.Page
  const postNode = data.Page

  return (
    <Layout>
       // conditional logic here
       // if {id} is 40 output <AdditionalContent />
    </Layout>
  )
}

我想知道是否可以检查id是否为40，然后输出<AdditionalContent>组件。

Answer 1

您可以这样定义

<div role="alert" id="shopFormErrorsAlert" class="fade visible alert alert-danger show">
    <ul id="pincode">
        <li id="i-1650524308">The pincode field is required.</li>
        <li id="i-557689933">The pincode must be a number.</li>
    </ul>
    <ul id="email">
        <li id="i16726618">The email must be a valid email address.</li>
    </ul>
</div>