Create a custom react native component

Question

I'm not an expert on react, and I can't find a way to do this, but how can I create a custom component that I could be used like this:

<MyComponent>
   <View></View>
   <View></View>
        ...
</MyComponent>

Where, inside I could place whatever I want. The MyComponent could be:

<View>
   <View> 
   </View> <-- Header 
   <View> 
   </View> <-- Content
     Childs, the two Views, would be placed here.
   <View>
   <View>
   </View> <-- Fotter
</View>

Is this possible to achieve?

Thanks very much in advance :)

It seems unclear what you are trying to accomplish, Can you explain what your trying to accomplish? — Shmili Breuer
– Shmili Breuer, Commented Feb 10, 2020 at 19:47
I want to create the MyComponent and use it by <MyComponent><MyComponent/> and place any childs components I need — JaimeASV
– JaimeASV, Commented Feb 10, 2020 at 19:51

Sick Ranchez · Accepted Answer · 2020-10-28 19:41:46Z

2

Change your MyComponent like this

<View>
   <View> 
   </View> <-- Header 
   <View> 
   </View> <-- Content

    {this.props.children}

   <View>
   </View> <-- Footer
</View>

edited Oct 28, 2020 at 19:41

answered Feb 11, 2020 at 2:04

Sick Ranchez

2281 silver badge13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

JaimeASV Over a year ago

thank you, I tried this, but I guess I did not try hard enough

Sick Ranchez Over a year ago

You're welcome. I just solved a bug that took my 13 hours of non-stop working.Enjoy your life haha.

Collectives™ on Stack Overflow

Create a custom react native component

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related