ReactJS: How to add an unsupported React component (JSX tag)?
There are several tags that are not yet defined in ReactJS, for example <animate>
in the SVG namespace.
How are base nodes like React.DOM.div
and React.DOM.span
defined in React? Or How are core tags like <div>
and <span>
defined in JSX?
Can the same method be used to extend React to define a standard tag <animate>
? I don't want to develop and renew the React Github project.
source to share
The easiest (and ugliest) way to do this is to render with dangerouslySetInnerHTML: http://facebook.github.io/react/docs/jsx-gotchas.html You just generate <animate>
as a string passing it to the wrapper div as innerHTML.
Otherwise, you will need to dig up the internals of React, namely the function createDOMComponentClass
in ReactDOM.js
. If you go that far, I bet you can request a pull request to merge the tag.
source to share