Can you explain it to me why rerendered element doesnt apply change to the element state.status property?Is using ReactDOM.unmountComponentAtNode proper way to do this?I know that the element should not delete itself but this is for presentation.
class CustomModal extends React.Component {
constructor(props){
super(props)
this.state = {
status:this.props.status
}
this.onClick = this.onClick.bind(this);
}
render(){
return <h1 onClick={this.onClick}>Click Me!</h1>
}
onClick(){
console.log('May i log to console?:' + this.state.status)
this.setState({status:false});
// this is somewhat cumbersome?
{/* ReactDOM.unmountComponentAtNode(document.getElementById('container')) */}
// supposed to rerender the element?
// And the state.status element should be true?
ReactDOM.render(<CustomModal status={true} />,document.getElementById('container'))
}
}
ReactDOM.render(<CustomModal status={true} />,document.getElementById('container'))<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="container">
</div>