Issues with 2+ children in v4.0.5

maslianok / react-resize-detector

A Cross-Browser, Event-based, Element Resize Detection for React

http://maslianok.github.io/react-resize-detector/

MIT License

1.25k stars 91 forks source link

Issues with 2+ children in v4.0.5 #69

Closed clintharris closed 5 years ago

clintharris commented 5 years ago

I'm noticing a couple of issues with v4.0.5 and how the array of children are handled.

The following results in a Each child in a list should have a unique "key" prop warning:
```
<ReactResizeDetector>
<Foo />
<Bar />
</ReactResizeDetector>
```

The following results in TypeError: element is null:

<ReactResizeDetector>
{ someBoolean ? <Foo /> : null }
<Bar />
</ReactResizeDetector>

maslianok commented 5 years ago

@clintharris thanks for reaching out!

Regarding the first issue, I'd like to force everyone to set element keys intentionally. Of course, we can set keys inside the library but this will rewrite keys in case they set by the user.

The next example should work without any warnings

<ReactResizeDetector>
  <Foo key="foo" />
  <Bar key="bar" />
</ReactResizeDetector>

The second issue fixed in the v4.1.1