处理web左侧菜单,刷新后菜单状态不匹配的问题
This commit is contained in:
parent
ab87528cca
commit
27e3dbfb20
|
@ -3,10 +3,12 @@
|
||||||
<a-layout id="components-layout-demo-custom-trigger" style="height: 100%">
|
<a-layout id="components-layout-demo-custom-trigger" style="height: 100%">
|
||||||
<a-layout-sider theme="light" v-model="collapsed" :trigger="null" collapsible width="350px">
|
<a-layout-sider theme="light" v-model="collapsed" :trigger="null" collapsible width="350px">
|
||||||
<div style="height:100%">
|
<div style="height:100%">
|
||||||
|
<!-- :defaultSelectedKeys="defaultSelectedKeys" -->
|
||||||
|
<!-- :defaultOpenKeys="defaultOpenKeys" -->
|
||||||
<a-menu
|
<a-menu
|
||||||
id="dddddd"
|
id="dddddd"
|
||||||
:defaultSelectedKeys="defaultSelectedKeys"
|
:openKeys="openKeys"
|
||||||
:defaultOpenKeys="defaultOpenKeys"
|
v-model="currSlecteKey"
|
||||||
mode="inline"
|
mode="inline"
|
||||||
:inline-collapsed="collapsed"
|
:inline-collapsed="collapsed"
|
||||||
@openChange="onOpenChange"
|
@openChange="onOpenChange"
|
||||||
|
@ -90,6 +92,7 @@ export default {
|
||||||
openKeys: [],
|
openKeys: [],
|
||||||
// 选中的子菜单项
|
// 选中的子菜单项
|
||||||
defaultSelectedKeys: [],
|
defaultSelectedKeys: [],
|
||||||
|
currSlecteKey: [],
|
||||||
defaultOpenKeys: [],
|
defaultOpenKeys: [],
|
||||||
rootSubmenuKeys: ['/istatistics/imsData', '/istatistics'],
|
rootSubmenuKeys: ['/istatistics/imsData', '/istatistics'],
|
||||||
}
|
}
|
||||||
|
@ -104,31 +107,35 @@ export default {
|
||||||
console.log("路由信息",this.menus);
|
console.log("路由信息",this.menus);
|
||||||
// this.initDefaultKeys(this.menus[0])
|
// this.initDefaultKeys(this.menus[0])
|
||||||
// 将从缓存中取出openKeys
|
// 将从缓存中取出openKeys
|
||||||
// const openKeys = window.sessionStorage.getItem('openKeys')
|
const openKeys = window.sessionStorage.getItem('openKeys')
|
||||||
const selectedKeys = window.sessionStorage.getItem('currMenu')
|
const selectedKeys = window.sessionStorage.getItem('currMenu')
|
||||||
if (selectedKeys) {
|
if (selectedKeys) {
|
||||||
this.defaultSelectedKeys.push(selectedKeys)
|
// this.defaultSelectedKeys.push(selectedKeys)
|
||||||
|
this.currSlecteKey.push(selectedKeys)
|
||||||
} else {
|
} else {
|
||||||
this.initDefaultKeys(this.menus[0])
|
this.initDefaultKeys(this.menus[0])
|
||||||
}
|
|
||||||
console.log(this.menus);
|
|
||||||
this.menus.forEach(item => {
|
this.menus.forEach(item => {
|
||||||
if (item.name!=="istatistics-data") {
|
if (item.name!=="istatistics-data") {
|
||||||
this.defaultOpenKeys.push(item.path)
|
// this.defaultOpenKeys.push(item.path)
|
||||||
|
this.openKeys.push(item.path)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
window.sessionStorage.setItem('openKeys', JSON.stringify(this.openKeys))
|
||||||
|
}
|
||||||
// if (openKeys) {
|
// if (openKeys) {
|
||||||
// // 存在即赋值
|
// // 存在即赋值
|
||||||
// this.defaultOpenKeys = JSON.parse(openKeys)
|
// this.defaultOpenKeys = JSON.parse(openKeys)
|
||||||
// }
|
// }
|
||||||
// if (openKeys) {
|
if (openKeys) {
|
||||||
// // 存在即赋值
|
// 存在即赋值
|
||||||
// this.openKeys = JSON.parse(openKeys)
|
this.openKeys = JSON.parse(openKeys)
|
||||||
// }
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 点击菜单,路由跳转,注意的是当点击MenuItem才会触发此函数
|
// 点击菜单,路由跳转,注意的是当点击MenuItem才会触发此函数
|
||||||
menuClick({ item, key, keyPath }) {
|
menuClick({ item, key, keyPath }) {
|
||||||
|
this.currSlecteKey = []
|
||||||
|
this.currSlecteKey.push(key)
|
||||||
window.sessionStorage.setItem('currMenu', key)
|
window.sessionStorage.setItem('currMenu', key)
|
||||||
// var parentPath = item._props.parentMenu._props.eventKey;
|
// var parentPath = item._props.parentMenu._props.eventKey;
|
||||||
// var parentTitle = parentPath.substring(parentPath.lastIndexOf("/") + 1, parentPath.length)
|
// var parentTitle = parentPath.substring(parentPath.lastIndexOf("/") + 1, parentPath.length)
|
||||||
|
@ -139,18 +146,21 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
initDefaultKeys(data) {
|
initDefaultKeys(data) {
|
||||||
this.defaultOpenKeys.push(data.path)
|
// this.defaultOpenKeys.push(data.path)
|
||||||
|
this.openKeys.push(data.path)
|
||||||
// if (data.children) {
|
// if (data.children) {
|
||||||
if (data.name!=="istatistics-StateOfHealth-alerts") {
|
if (data.name!=="istatistics-StateOfHealth-alerts") {
|
||||||
|
|
||||||
data.children.some((f) => {
|
data.children.some((f) => {
|
||||||
if (f.children) {
|
if (f.children) {
|
||||||
// 第一个节点展开
|
// 第一个节点展开
|
||||||
this.defaultOpenKeys.push(f.path)
|
// this.defaultOpenKeys.push(f.path)
|
||||||
|
this.openKeys.push(f.path)
|
||||||
this.initDefaultKeys(f.children[0])
|
this.initDefaultKeys(f.children[0])
|
||||||
} else {
|
} else {
|
||||||
// 选中
|
// 选中
|
||||||
this.defaultSelectedKeys.push(f.path)
|
// this.defaultSelectedKeys.push(f.path)
|
||||||
|
this.currSlecteKey.push(f.path)
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue
Block a user