Outline
In this video, we learn how to use props to toggle parts of the layout on and off depending on which pages needs what.
In Layout.js
, we can add a boolean check for whether we have a noHeader
prop. If we don't, we'll display the Header
. The code looks like this:
<div>
{!noHeader && <Header />}
{children}
</div>
Then, in about.js
, we can add a noHeader
prop to the Layout
component to turn hide that h1
tag.
Let's do an assignment to help you remember how to nest layout components.