Create react component dynamically

This should work:

var component = Components[itemData['itemClass']]);
return React.createElement(component, {
    data: itemData,
    key: itemData['id']
});

You can’t use JSX syntax like this <component .../> because when it gets transpiled component won’t refer to anything.

UPDATE: Here is the updated ItemList component in full:

var ItemList = React.createClass({
    render: function() {
        console.log(this.props);

        var items = this.props.data["items"].map(function(itemData) {
            var component = Components[itemData['itemClass']];
            return React.createElement(component, {
                data: itemData,
                key: itemData['id']
            });
        });
        console.log(items);
        return (
            <div className="list">
                <div>And I am an ItemList</div>
                <div>{items}</div>
            </div>
        );
    }
});

You can see it working in this fiddle: http://jsfiddle.net/fmhhtk5o/3/

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)