如何解决React-打开子模式并关闭汉堡菜单
我需要单击汉堡菜单中的链接并关闭汉堡菜单并打开模态。 我正在使用 react-burger-menu 和 react-bootstrap/Modal。 问题是,当我点击 Activity 时,模态打开,模态菜单和侧边菜单都关闭。这是代码。 Here is a screenshot
这是侧边栏(汉堡菜单)
[Noun,Pen,Noun,Box,Note,Scale]
这是模态:
import React from 'react';
import { stack as Menu } from 'react-burger-menu';
import { isAuth,signout } from '../auth/helpers';
import "bootstrap/dist/css/bootstrap.min.css";
import MyModal from './MyModal'
//export default props => {
class Sidebar extends React.Component {
handleStateChange (state) {
this.setState({menuOpen: state.isOpen})
}
closeSideMenu () {
this.setState({menuOpen: false})
}
state = {
showModal: false,menuOpen: false
};
showModal = e => {
this.setState({
showModal: !this.state.showModal
});
};
render() {
return (
<Menu
isOpen={this.state.menuOpen}
onStateChange={(state) => this.handleStateChange(state)}
>
<a className="menu-item"
onClick={e => {
this.setState({ menuOpen: false });
this.showModal(e);
}
}
>
Activity
</a>
<a className="menu-item" href="/">
Community
</a>
<a className="menu-item" href="/">
Settings
</a>
<a className="menu-item" href="/">
Learn More
</a>
<a className="menu-item" onClick={signout} href="/">
Sign out
</a>
<MyModal onHide={this.showModal} show={this.state.showModal}></MyModal>
</Menu>
);
};
}
export default Sidebar;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。