I'm making an HTML5 game page and wanted to have my login form be a modal when the user loads the page. I have set the state to true and tried moving the state to app.js but neither works
export default class Modal extends Component {
state = { show: true };
showModal = () => {
this.setState({ show: true });
};
hideModal = () => {
this.setState({ show: false });
};
render() {
return (
<div className="modal">
<section className="modal-main">
<Login username={this.props.username} email={this.props.email} password={this.props.password} />
<button onClick={this.hideModal}>close</button>
</section>
</div>
);
}
}
I have the modal imported into app.js but it still is not loading.
You can use something like:
render() {
return (
<div className="modal">
<section className="modal-main">
{this.state.show &&
<Login username={this.props.username} email={this.props.email} password={this.props.password} />
}
<button onClick={this.hideModal}>close</button>
</section>
</div>
);
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.