I'm trying to nest a modal component within the navbar component, but I come up with the following error:
Error: _processChildContext is not available in React 16+. This likely means you have multiple copies of React and are attempting to nest a React 15 tree inside a React 16 tree using unstable_renderSubtreeIntoContainer, which isn't supported. Try to make sure you have only one copy of React (and ideally, switch to ReactDOM.createPortal).
My code:
import React, { Component } from 'react';
import { Navbar, NavItem, Modal, Button } from 'react-materialize';
class Header extends Component {
constructor(props) {
super(props);
this.state = {
showLoginModal: false
};
this.toggleLoginModal = this.toggleLoginModal.bind(this);
}
toggleLoginModal() {
this.setState({ showLoginModal: !this.state.showLoginModal });
}
render() {
console.log(this.state.showLoginModal);
return (
<div>
<Navbar brand='Voting App' right>
<Modal
header='Login'
trigger={<Button>Login</Button>}
>
Login
</Modal>
</Navbar>
</div>
)
}
}
export default Header;
Any ideas why this is the case? Been trying to figure out the best way to introduce modals in react using the materialize styling, but hitting a lot of brick walls. Any help very welcome!