{% load react_jsonfilter %}

<script>
    {% for component in components %}
        ReactDOM.render(
            React.createElement({{ component.component }},
                {% if component.data %}
                    {{ component.data|react_json }}
                {% else %}
                    null
                {% endif %}),
            document.getElementById('{{ component.identifier }}')
        );
    {% endfor %}
</script>

{% load react_jsonfilter %}

<script>
    {% for component in components %}
        ReactDOM.hydate(
            React.createElement({{ component.component }},
                {% if component.data %}
                    {{ component.data|react_json }}
                {% else %}
                    null
                {% endif %}),
            document.getElementById('{{ component.identifier }}')
        );
    {% endfor %}
</script>

Use new react 16 hydrate
Use new react 16 hydrate
