Convert an array of element data to react elements. Prettier than JSX, less verbose than using React.DOM directly. Inspired by (though not as pretty as) Hiccup.
$ npm install [--save] react-dom-wrapper
var DOM = require('react-dom-wrapper');
var element = DOM([
'div#wrapper',
{ className: 'asd' },
['span.message.important', 'hello', ['span.bold', name]],
[CustomComponent, { customProp: 'hello' }],
[
'ul',
arrayOfThings.map(function(thing) {
return ['li', { key: thing.id }, thing.value]
})
]
]);
React.render(element, mountNode);
If you want to use a different version of React entirely, you can do var DOM = require('react-dom-wrapper/react-dom-wrapper')(myCustomReact)
.
An element is an array consisting of:
- Element type (string or React component)
- Optional props object
- Zero or more children (string, element spec, React element, or an array (can even be nested) of any of those)
There are test! Buster is used. npm test
runs the test, npm run autotest
watches the files and runs tests automatically.
MIT