render-array
A convenient way to return an array of JSX wihout the wrapping div
element when using React 16.
Install
$ npm i --save render-array
React 16 allows you to return an array, but you must use the following syntax:
const App = <div>A</div> <div>B</div>;
See the awkward comma after the first div
? I sent a tweet to Dan Abramov about this and he replied:
We were might explore something like <><div /><div /></> in the future
Not exactly an optimal solution either, IMO. In the mean time, I wrote RenderArray
so your can code like this:
const App = <RenderArray> <div>A</div> <div>B</div> </RenderArray>;
It looks the same as components you are used to in React 15, but it returns the children without a wrapping div
element.
See live example on CodeSandbox.