Passing props to a component in Ionic React

Hi Folks,

I was wondering if anyone can tell me if it is possible to pass props to a custom component in Ionic React? I tried doing it the react way, for example

<Header data = {data} />

But it did not work. I can use custom components without props though.

Can anyone tell me if it is possible or if there is a workaround for that?

Cheers

it is possible, would need to see more code

For example

const Country = ({ country }) => {
  console.log(country)
  if (!country) {
    return null
  }


  return (
    <div>
      <h3>{country[0].name} </h3>
      <div>capital {country[0].capital} </div>
      <div>population {country[0].population}</div> 
      <img src={country[0].flag} height='100' alt={`flag of ${country[0].name}`}/>  
    </div>
  )
}

here i have a component called country. Can i use it in App, like this?

const App = () => {
const country = ‘some details about country’

}

<Country country={country} />

const Country = ({ country }) => {
  console.log(country)
  if (!country) {
    return null
  }


  return (
    <div>
      <h3>{country[0].name} </h3>
      <div>capital {country[0].capital} </div>
      <div>population {country[0].population}</div> 
      <img src={country[0].flag} height='100' alt={`flag of ${country[0].name}`}/>  
    </div>
  )
}

Thanks for the reply.

Actually, const Country = ({ country }) => { did not work for me, but const Country = ({ country }: any) => { did work.

Thanks again