How to define a tree type in TypeScript?

Question

I wrote a tree-like type as below:

type ReactNode = ReactChild | Array<ReactNode>

but the editor told me that

TS2456: type alias 'ReactNode' circularly references itself.

How to solve/fix this error?

Nitzan Tomer · Accepted Answer · 2017-09-14 10:18:13Z

6

There's a problem with recursions in type aliases, as shortly explained in this issue:

type aliases are not like interfaces. interfaces are named types, where as type aliases are just aliases. internally as well they are treated differently, the compiler aggressively flatten types aliases to their declarations.

There's a longer discussion here: allow recursive generic type aliases.

In your case, you can do something like:

interface ReactNodeArray extends Array<ReactNode> {}

type ReactNode = ReactChild | ReactNodeArray;

answered Sep 14, 2017 at 10:18

Nitzan Tomer

166k51 gold badges330 silver badges307 bronze badges

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

Collectives™ on Stack Overflow

How to define a tree type in TypeScript?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related