feat: click sidebar menu add collapse and expand, close #294
This commit is contained in:
parent
820abeb0fd
commit
5e161a1420
3 changed files with 21 additions and 5 deletions
|
|
@ -13,6 +13,7 @@ export function eventMixin (proto) {
|
|||
export function initEvent (vm) {
|
||||
// Bind toggle button
|
||||
sidebar.btn('button.sidebar-toggle', vm.router)
|
||||
sidebar.collapse('.sidebar', vm.router)
|
||||
// Bind sticky effect
|
||||
if (vm.config.coverpage) {
|
||||
!isMobile && on('scroll', sidebar.sticky)
|
||||
|
|
|
|||
|
|
@ -14,17 +14,26 @@ export function btn (el, router) {
|
|||
toggle()
|
||||
})
|
||||
|
||||
const sidebar = dom.getNode('.sidebar')
|
||||
|
||||
isMobile &&
|
||||
dom.on(
|
||||
dom.body,
|
||||
'click',
|
||||
_ => dom.body.classList.contains('close') && toggle()
|
||||
)
|
||||
dom.on(sidebar, 'click', _ =>
|
||||
setTimeout((_ => getAndActive(router, sidebar, true, true), 0))
|
||||
)
|
||||
}
|
||||
|
||||
export function collapse (el, router) {
|
||||
el = dom.getNode(el)
|
||||
|
||||
dom.on(el, 'click', ({ target }) => {
|
||||
if (
|
||||
target.nodeName === 'A' &&
|
||||
target.nextSibling &&
|
||||
target.nextSibling.classList.contains('app-sub-sidebar')
|
||||
) {
|
||||
dom.toggleClass(target.parentNode, 'collapse')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export function sticky () {
|
||||
|
|
|
|||
|
|
@ -270,6 +270,12 @@ main {
|
|||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
li.collapse {
|
||||
.app-sub-sidebar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue