check if stylesheet is loaded then render elements

Viewed 1766

I'm developing universal react application using react, redux, react-router and react-helmet. Each page in my application has seperated stylesheet. When routes change in client side, at first, the elements have no style yet. and for a few milliseconds, my page gets ugly! I want a solution for this problem . How can I know when stylesheet loaded?

My Container Component :

render() {
        return (
            <div>
                <Helmet>
                    <title>MyTitle</title>
                    <link rel="stylesheet" href="../search-page.css"/>
                </Helmet>
                <div id="container"">
                   <MyComponents />
                </div>
            </div>
        )
    }
1 Answers
Related