我正在创建一个HTML5游戏页面,并希望在用户加载页面时将我的登录表单作为模态。我已将状态设置为true并尝试将状态移至app.js,但两者均无效
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>
);
}
}
我将模式导入到app.js但它仍然没有加载。
您可以使用以下内容:
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>
);
}