lundi 4 janvier 2016

ReactJS integration with libraries using getElementById

What is the best approach for rendering components using libraries for which direct access to the DOM is required (e.g. document.getElementById()) ? Currently I got things working thanks to setTimeout :

class MyComponent extends React.Component {
    render(){
        setTimeout(function(){
            myCoolGraphLibrary.createChart({
                container : "myChartContainer",
                series : [...],
                ...
            });    
        },1000);
        return (<div id="myChartContainer"></div>);
    }
}

Without setTimeout, the container is not yet available in the DOM so the call to createChart fails.

Is there a better design pattern for achieving this ?

Aucun commentaire:

Enregistrer un commentaire