How can I conditionally send props depending on parent element?

April 25, 2022

I have a component called ListLayout which is a child component for two parent components. I want to pass props based on whichever page is being rendered. Is it possible?

The ListLayout component is as follows;

export default function ListLayout(props) {
    return (
    <div>
    <TabNavigation (conditionally accept here based on page being rendered) />
    </div>
}

Two parent components send props to ListLayout.

>Solution :

You can do something like

export default function ListLayout(props) {
  return (
    <div>
      <TabNavigation pageData={props.pageOne ? 'send page one' : 'send page two'} />
    </div>
  )
}