score:2

Yes Absolutely you can. In fact React docs talk about "Lifting state up" so to speak.

If there is shared state between components and you need to lift it up to their nearest ancestor.

The general concept is props are passed down and state is passed up.

However, this can get messy. If you are working on a larger project, I would recommend using Redux.

You can pass the state as props, but if you want child components to alter state, then you can pass the setter from the useState directly to child components.

Here is the same example:

<PostContainer
   data={dataOnMap}
   addLike={addLike[index]}
   searchData={searchData}
   setSearchData={setSearchData}
   setAddLike={setAddLike}
/>

Or another solution

const LikeManager = {
  addLike: setAddLike,
  data: {
     //some data
  }  
}

<PostContainer
   data={dataOnMap}
   likeManager: {LikeManager}
/>

I know this is not part of the question, but I would recommend using scalar values for useState wherever possible

score:32

Yes, as far as passing down props are concerned there is no difference in usage with React Hooks. In the snippet you've provided just pass setSearchData as a prop to PostContainer.

<PostContainer
  data={dataOnMap}
  addLike={addLike[index]}
  searchData={searchData}
  setSearchData={setSearchData}
/>

Related Query

More Query from same tag