snowleopardAlexa
snowleopardAlexa

Reputation: 19

How to pass multiple components dynamically inside other component react native

photo

I think my problem is very easy, but I am learning RN and I am stuck. I want to pass Header, PhotoCarousel, UserDetails components dynamically inside KennelScreen component, for right now I just did it in the JS way. Is there any other way to do it?

Thanks!

Upvotes: 0

Views: 389

Answers (1)

Stevetro
Stevetro

Reputation: 1963

Depends on what you want to archive. You could create them dynamically via

const KennelScreen = () => {
  return (
    <SafeAreaView>
      <ScrollView>
        {React.Children.map(this.props.children, (child) =>
          React.cloneElement(child)
        )}
      </ScrollView>
    </SafeAreaView>
  );
};

Then you can use it in your parent screen with

<KennelScreen>
 <Header />
....
</KennelScreen>

Upvotes: 1

Related Questions