How to implement custom component that accepts a nested component?-CodePudding

I would like to implement a custom component that accepts a nested component. Something that can be used like this.

<MyCustomComponent>
  <AnyNestedComponent/>
</MyCustomComponent>

I searched about this but only found the use of this.props, which is not what I expect.

How do I implement MyCustomComponent in React Native version 0.68?

Note: MyCustomComponent will consist of View(s).

CodePudding user response：

Its fairly simple in RN,

Your customComponent should be like =

const CumstomComp = ({props = {}, children = null}) => {

return(
<View style={{backgroundColor:"red"}} >

{children}

</View>

)

}

and then you use it like this

App.js or whatever file

const App = () => {

return(
<View>
<CustomComp>
<Flatlist />
<View />
</CustomComp>
</View
)

}

Hope it helps. feel free for doubts