伙计们,我知道标题有些混乱,但是我敢肯定,在这里您会更好地理解我的需求。因此,我试图建立一个像instagram这样的社交媒体应用,此刻我正在构建登录组件,但由于仍在学习如何使用react而陷入困境。所以这里有我的登录组件:
function Loginmenu (){
const [email,setEmail] = useState(null);
const [password,setPassword] = useState(null);
return (
<div style = {styles2}>
<form classname="form-signin" style = {styles}>
<div classname="form-label-group" >
<label htmlFor="inputEmail">
Email address
<input
type="email"
id="inputEmail"
classname="form-control"
placeholder="Email address"
required
autoFocus
onChange = {event => setEmail(event.target.value)}
></input>
</label>
</div>
<div classname="form-label-group" >
<label htmlFor="inputPassword">
Password
<input
type="password"
id="inputPassword"
classname="form-control"
placeholder="Password"
required
onChange = {event => setPassword(event.target.value)}
></input>
</label>
</div>
<button
classname="btn btn-lg btn-primary btn-block"
onClick = {() => <MainApp/>}
type="submit"
>
Sign in
</button>
</form>
</div>
);
} 我要做的就是,当我单击按钮时,MainApp组件内容将接管页面,而登录菜单将消失,就像在每个具有登录屏幕的站点中发生的一样