How to replace components with each other in react js?
<p>onClick in login component, I have to display <strong>Home</strong> component and onClick in home component I have to display login component. But Getting this error</p>

<pre><code>Uncaught Error: Element type is invalid: expected a string (for built-in
components) or a class/function(for composite components) but got: object(...)
</code></pre>

<p>please help me to resolve this. </p>

<p><strong>Login</strong></p>

<pre><code>handleSubmitValidateInput: function(e){
    e.preventDefault();
    ReactDOM.unmountComponentAtNode(document.getElementById('content'));
    ReactDOM.render(&lt;Home UserDetails={data}/&gt;, document.getElementById('content'));
}
</code></pre>

<p><strong>Home</strong></p>

<pre><code>handleLogout: function(e){
    e.preventDefault();
    ReactDOM.unmountComponentAtNode(document.getElementById('content'));
    ReactDOM.render(&lt;Login /&gt;, document.getElementById('content'));
</code></pre>

<p>But I am able to render both in another component. When I click in <strong>Home</strong> component, I am getting the error.</p>