动态菜单

This commit is contained in:
red-deng-deng 2021-11-29 17:08:36 +08:00
parent 34c41b64be
commit 281614065b
3 changed files with 60 additions and 38 deletions

View File

@ -14,41 +14,46 @@ export default class topNav extends React.Component{
linkshowname:sessionStorage.getItem('linkshowname'),
showflag:JSON.parse( sessionStorage.getItem('showflag'))
}
console.log(17,props.listnav);
this.backFn=this.backFn.bind(this)
}
//点击一级菜单
showlinkmenu(e,item){
this.setState({pathname:item.path})
this.setState({'linkshowname':item.name});
this.setState({'menulinklist':item.childmenu});
let self=this;
console.log(22,item.child);
try{
item.child.forEach(item=>{
if(item.level ===5){
sessionStorage.setItem('pathname2',item.router);
throw '终止循环'
}
})
}catch(e){
console.log(e)
}
self.setState({'linkshowname':item.title});
self.setState({'menulinklist':item.child});
// 防止刷新页面,导航签清空
sessionStorage.setItem('menulinklist',JSON.stringify(item.childmenu));
sessionStorage.setItem('menulinklist',JSON.stringify(item.child));
sessionStorage.setItem('showflag',true);
sessionStorage.setItem('linkshowname',item.name);
if(item.childmenu.length>0){
sessionStorage.setItem('pathname2',item.childmenu[0].items[0].path);
}
sessionStorage.setItem('linkshowname',item.title);
}
btnfn(item2){
this.setState({pathname2:item2.path})
this.setState({pathname2:item2.router})
this.setState({showflag:true});
sessionStorage.setItem('showflag',true)
sessionStorage.setItem('pathname2',item2.path)
sessionStorage.setItem('pathname2',item2.router)
}
//返回
backFn(items){
this.setState({'pathname2':items[0].path});
this.setState({'pathname2':items.router});
sessionStorage.setItem('showflag',true)
sessionStorage.setItem('pathname2',items[0].path)
sessionStorage.setItem('pathname2',items.router)
window.history.go(-1)
}
breakFn(item){
sessionStorage.setItem('pathname2',item)
}
componentWillMount(){
@ -74,7 +79,8 @@ export default class topNav extends React.Component{
{
this.state.navlists.map((item,i)=>{
return (
<Link key={i} to={item.path} style={this.state.linkshowname==item.name?{width:"#100%",background:"#f2f4f7",color:'#296bef'}:null} className={this.state.linkshowname==item.name?'active':''} onClick={(e)=>this.showlinkmenu(e,item)} >{item.name}</Link>
item.child&&item.child.length>0?<Link key={i} to={item.router} style={this.state.linkshowname==item.title?{width:"#100%",background:"#f2f4f7",color:'#296bef'}:null} className={this.state.linkshowname==item.title?'active':''} onClick={(e)=>this.showlinkmenu(e,item)} >{item.title}</Link>:null
)
})
}
@ -83,24 +89,18 @@ export default class topNav extends React.Component{
{
editbreakflag== false && planbreakflag == false && sedcbreakflag==false&&this.state.menulinklist!=''&&breakflag==false&&routeflag=='true'?(
<div className="linkmenu" >
{
this.state.menulinklist.map((item,key)=>{
return(
<div className="dflexaj navshow" key={key}>
<div className="dflexaj navshow">
<div className="linkmenu-row" >
{
item.items.map((item2,key2)=>{
return(
<Link key={key2} to={item2.path} onClick={()=>this.btnfn(item2)} className={pathnameBreak==item2.path&&item.items.length>1?'menuactive':''}>{item2.name}</Link>
)
})
}
{
this.state.menulinklist.map((item,key)=>{
return(item.level==5?<Link key={key} to={item.router} onClick={()=>this.btnfn(item)} className={pathnameBreak==item.router&&item.child.length>=1?'menuactive':''}>{item.title}</Link>:null)
}) }
</div>
<span>数据最后更新时间:{window.timeshow}</span>
</div>
)
})
}
</div>
):null
}

View File

@ -195,6 +195,8 @@ export default class App extends Component {
}
componentWillMount(e){
let activeMenuList=JSON.parse(sessionStorage.getItem('activeMenu'));
this.setState({'navlist':activeMenuList});
const pathname=window.location.href.lastIndexOf('\/');
const pathnamestr=window.location.href.substr(pathname);
this.getUserInfuFn();

View File

@ -35,11 +35,31 @@ function FormDom(props) {
Notify.clear();
Notify.success(msg);
sessionStorage.setItem('showflag',true);
let arr= [{
group:'营销计划管理',
items:[{path:'/home/plan-list',name:'营销计划管理'}]
}]
sessionStorage.setItem('menulinklist',JSON.stringify(arr));
let menuList=response.menu;
try{
menuList.forEach(item=>{
if(item.id===16){
if(item.child&&item.child.length>0){
let obj=item.child.filter(item=>item.level==5);
sessionStorage.setItem('pathname2',obj[0].router);
sessionStorage.setItem('menulinklist',JSON.stringify(item.child));
}else{
if(item.child&&item.child.length>0){
let obj=item.child.filter(item=>item.level==5);
sessionStorage.setItem('pathname2',obj[0].router);
sessionStorage.setItem('menulinklist',JSON.stringify(item.child));
}
}
throw '终止循环'
}else{
}
})
}catch(e){
console.log(e)
}
sessionStorage.setItem('activeMenu',JSON.stringify(response.menu));
sessionStorage.setItem('linkshowname',"营销计划管理");
setTimeout(()=>{