Non standard custom attributes in ReactJS? -

this regarding non-standard attributes. https://facebook.github.io/react/docs/tags-and-attributes.html

in react have done this:

 react.createelement('div', {image:'blah', etc:'blah'}); 

i need image , etc set on element setattribute, , need react use smarts maintain changes.

a solution here https://stackoverflow.com/a/21654914/1828637 says add on componentdidmount not solution. attribute not maintained changes react framework.

is there anyway tell react set attribute on custom tags?

this solution build on linked answer using react lifecycle method componentwillreceiveprops update dom element attributes every change props. more information lifecycle methods, see http://facebook.github.io/react/docs/component-specs.html.

(since componentwillreceiveprops can called more often when props change, may wish compare props before setting them on node.)

i've provide fiddle can play with: https://jsfiddle.net/p4h267bo/ , relevant part of code excerpted here:

var hello = react.createclass({   componentdidmount() {     this.mirrorprops(this.props);   },   componentwillreceiveprops(nextprops) {     this.mirrorprops(nextprops);   },   mirrorprops(props) {     var node = reactdom.finddomnode(this);     node.setattribute('name', props.name);   },   render: function() {     return <div>hello {this.props.name}</div>;   } });