有效的方法: 我有一个带有Bootstrap 4类的下拉菜单,当我单击按钮时,这些下拉菜单会隐藏到Google,Facebook或Firebase中,而这些事件都有要登录的事件。
什么不起作用 但是,只要我单击“忘记密码”或“注册”链接,页面就会更改为所选路线,但是下拉列表会继续显示并且不会隐藏。
我需要什么帮助: 找出隐藏下拉菜单的正确方法是单击两个链接之一:“忘记密码”和“注册”
class Signin extends Component {
constructor(props) {
super(props);
this.state = {
show: false,
email: "",
password: ""
};
//handleInputEmail function here
//handleInputPassword function here
//Firebase signIn function here
//handleSubmit function here
render() {
render() {
return (
<div className="nav-item dropdown">
<a
className="nav-link dropdown-toggle"
href="#"
id="navbarDropdown"
role="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
onClick={this.handleLoggedIn}
>
Iniciar Sesión
</a>
<ul id="login-dp" className="dropdown-menu">
<li>
<div className="row">
<div className="col-md-12">
<form
className="form"
accept-charset="UTF-8"
id="login-nav"
onSubmit={this.handleSubmit}
>
<div className="form-group">
<label className="sr-only" for="exampleInputEmail2">
Correo Electrónico
</label>
<input
type="email"
className="form-control"
id="exampleInputEmail2"
placeholder="Correo Electrónico"
required
onChange={this.handleInputEmail}
/>
</div>
<div className="form-group">
<label className="sr-only" for="exampleInputPassword2">
Contraseña
</label>
<input
type="password"
className="form-control"
id="exampleInputPassword2"
placeholder="Contraseña"
required
onChange={this.handleInputPassword}
/>
</div>
<div className="checkbox">
<label>
<input type="checkbox" /> Recordarme
</label>
</div>
//ONCE CLICKED THIS LINK, THE DROPDOWN WILL NOT CLOSE, IT REMAINS OPEN
<div className="help-block text-detail">
<Link to="/forgotpassword">
Forgot password?
</Link>
</div>
<button type="submit" className="btn btn-primary btn-block">
Iniciar Sesión
</button>
<hr />
<p className="text-center text-detail">O también puedes</p>
<button
class="btn btn-block btn-primary btn-facebook"
onClick={this.props.signInWithFacebook}
>
<FaFacebookF /> Continuar con Facebook
</button>
<button
class="btn btn-block btn-primary btn-google"
onClick={this.props.signInWithGoogle}
>
<FaGoogle /> Continuar con Gmail
</button>
<div className="bottom text-center mt-2 text-detail">
Aún no tienes cuenta?
<br />
//ONCE CLICKED THIS LINK, THE DROPDOWN WILL NOT CLOSE, IT REMAINS OPEN
<Link to="/register">
<b>Register</b>
</Link>
</div>
</form>
</div>
</div>
</li>
</ul>
</div>
);