Doesn't load any component if navigated through react-router

[mahesh1996]

Consider below example.
We have 3 pages(e.g home, blogs, contact). When first time any page(e.g home) is loaded by any way(through react-router or through direct URL hit), then Facebook SDK is loaded and facebook-plugins component(e.g FBCommentsCount) on that pages is displayed. But after that if we navigate through react-router to any page(e.g blogs), then any facebook-plugins component(e.g FBComments) on that page(e.g blogs) is not being rerendered even though componentDidUpdate() method of that component(e.g FBComments) is called.

To overcome this problem, I have to implement componentWillUnMount() method in the facebook-plugins component which I was using(e.g FBComments, FBCommentsCount).
I added following code and it is working now.

componentWillUnmount = () => {
        if (document.getElementById('facebook-jssdk')) {
            let fbSdk = document.getElementById('facebook-jssdk');
            fbSdk.parentNode.removeChild(fbSdk);
        }
        if (window.FB) {
            delete window.FB;
        }
        if (document.getElementById('fb-root')) {
            let fbRoot = document.getElementById('fb-root');
            fbRoot.parentNode.removeChild(fbRoot);
        }
    }

I have to unload sdk every time component is un mounted and load it again as if it was loaded first time to let component render.
Why it is not woring in normal cases even componentDidUpdate() is being called?
What could be the problem?