Reactjs Render component dynamically based on a JSON config

Question

I have a following config as JSON

var componentConfig = {
content: { type: \"ContentContent\", data: \"content\"},
new_content: { type: \"ContentFormContent\", d         


        

Answer 1

React.renderComponent() has been deprecated, to use React.render() https://facebook.github.io/react/blog/2014/10/28/react-v0.12.html#deprecations

You may do something like:

var loadReactModule = function ($root, type, data) {
    var ContentContent= React.createClass({
        render: function () {
            return (
                
            );
        }
    });

    var ContentFormContent= React.createClass({
        render: function () {
            return (
                

            );
        }
    });

    var allComponents = {
         ContentContent: ContentContent,
         ContentFormContent: ContentFormContent
    };

    if (type in allComponents) {

        $root.each(function (index, rootElement) {
            React.render(React.createElement(allComponents[type]), {data:data}, rootElement);
        });
    }
};