CODEWITHSUNDEEP
reactjstypescript
Ahmed Ateeq
Ahmed Ateeq

Reputation: 61

How can I fix the type of children being passed to my functional component?

In my React/Typescript project, I need a Component, lets call that A (it is a functional component), which is simply a wrapper component and needs to accept and display two components that I have made (lets call them B and C) so that A can be used as the following:

<A>
 <B/>
 <C/>
</A>

I need to ensure that only B and C are passed as children of A and nothing else.

How can I achieve this in typescript?

Upvotes: 2

Views: 43

Answers (1)

Giorgi Moniava
Giorgi Moniava

Reputation: 28684

Something like this maybe?

interface AppProps {
  children: [React.ReactNode, React.ReactNode];
}

If you want to go further to check what those types are that maybe trickier, if possible at all.

Upvotes: 3

Related Questions