|
|
|
@ -16,6 +16,13 @@ export default class SiderMenu extends PureComponent { |
|
|
|
openKeys: this.getDefaultCollapsedSubMenus(props), |
|
|
|
}; |
|
|
|
} |
|
|
|
componentWillReceiveProps(nextProps) { |
|
|
|
if (nextProps.location.pathname !== this.props.location.pathname) { |
|
|
|
this.setState({ |
|
|
|
openKeys: this.getDefaultCollapsedSubMenus(nextProps), |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
getDefaultCollapsedSubMenus(props) { |
|
|
|
const { location: { pathname } } = props || this.props; |
|
|
|
const snippets = pathname.split('/').slice(1, -1); |
|
|
|
@ -46,7 +53,6 @@ export default class SiderMenu extends PureComponent { |
|
|
|
} |
|
|
|
getSelectedMenuKeys = (path) => { |
|
|
|
const flatMenuKeys = this.getFlatMenuKeys(this.menus); |
|
|
|
|
|
|
|
if (flatMenuKeys.indexOf(path.replace(/^\//, '')) > -1) { |
|
|
|
return [path.replace(/^\//, '')]; |
|
|
|
} |
|
|
|
@ -56,7 +62,7 @@ export default class SiderMenu extends PureComponent { |
|
|
|
return flatMenuKeys.filter((item) => { |
|
|
|
const itemRegExpStr = `^${item.replace(/:[\w-]+/g, '[\\w-]+')}$`; |
|
|
|
const itemRegExp = new RegExp(itemRegExpStr); |
|
|
|
return itemRegExp.test(path.replace(/^\//, '')); |
|
|
|
return itemRegExp.test(path.replace(/^\//, '').replace(/\/$/, '')); |
|
|
|
}); |
|
|
|
} |
|
|
|
getNavMenuItems(menusData) { |
|
|
|
@ -126,10 +132,16 @@ export default class SiderMenu extends PureComponent { |
|
|
|
} |
|
|
|
render() { |
|
|
|
const { collapsed, location: { pathname }, onCollapse } = this.props; |
|
|
|
const { openKeys } = this.state; |
|
|
|
// Don't show popup menu when it is been collapsed
|
|
|
|
const menuProps = collapsed ? {} : { |
|
|
|
openKeys: this.state.openKeys, |
|
|
|
openKeys, |
|
|
|
}; |
|
|
|
// if pathname can't match, use the nearest parent's key
|
|
|
|
let selectedKeys = this.getSelectedMenuKeys(pathname); |
|
|
|
if (!selectedKeys.length) { |
|
|
|
selectedKeys = [openKeys[openKeys.length - 1]]; |
|
|
|
} |
|
|
|
return ( |
|
|
|
<Sider |
|
|
|
trigger={null} |
|
|
|
@ -151,7 +163,7 @@ export default class SiderMenu extends PureComponent { |
|
|
|
mode="inline" |
|
|
|
{...menuProps} |
|
|
|
onOpenChange={this.handleOpenChange} |
|
|
|
selectedKeys={this.getSelectedMenuKeys(pathname)} |
|
|
|
selectedKeys={selectedKeys} |
|
|
|
style={{ padding: '16px 0', width: '100%' }} |
|
|
|
> |
|
|
|
{this.getNavMenuItems(this.menus)} |
|
|
|
|