Skip to content

Commit 6081a3d

Browse files
committed
fix: unexpected scroll behavior after clicking sidebar links (#298)
1 parent 5023d19 commit 6081a3d

File tree

3 files changed

+23
-3
lines changed

3 files changed

+23
-3
lines changed

lib/app/app.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import Router from 'vue-router'
33
import Content from './Content'
44
import ClientOnly from './ClientOnly'
55
import dataMixin from './dataMixin'
6+
import store from './store'
67
import NotFound from '@notFound'
78
import { routes } from '@temp/routes'
89
import { siteData } from '@temp/siteData'
@@ -57,7 +58,12 @@ export function createApp () {
5758
if (saved) {
5859
return saved
5960
} else if (to.hash) {
60-
return false
61+
if (store.disableScrollBehavior) {
62+
return false
63+
}
64+
return {
65+
selector: to.hash
66+
}
6167
} else {
6268
return { x: 0, y: 0 }
6369
}

lib/app/store.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
// It is not yet time to use Vuex to manage the global state
2+
// singleton object as a global store.
3+
const state = {
4+
disableScrollBehavior: false
5+
}
6+
7+
export default state

lib/default-theme/Layout.vue

+9-2
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import Navbar from './Navbar.vue'
2828
import Page from './Page.vue'
2929
import Sidebar from './Sidebar.vue'
3030
import { pathToComponentName } from '@app/util'
31+
import store from '@app/store'
3132
import { resolveSidebarItems } from './util'
3233
import throttle from 'lodash.throttle'
3334
@@ -165,7 +166,7 @@ export default {
165166
const sidebarLinks = [].slice.call(document.querySelectorAll('.sidebar-link'))
166167
const anchors = [].slice.call(document.querySelectorAll('.header-anchor'))
167168
.filter(anchor => sidebarLinks.some(sidebarLink => sidebarLink.hash === anchor.hash))
168-
169+
169170
const scrollTop = Math.max(window.pageYOffset, document.documentElement.scrollTop, document.body.scrollTop)
170171
171172
for (let i = 0; i < anchors.length; i++) {
@@ -177,7 +178,13 @@ export default {
177178
(!nextAnchor || scrollTop < nextAnchor.parentElement.offsetTop - 10))
178179
179180
if (isActive && this.$route.hash !== anchor.hash) {
180-
this.$router.replace(anchor.hash)
181+
store.disableScrollBehavior = true
182+
this.$router.replace(anchor.hash, () => {
183+
// execute after scrollBehavior handler.
184+
this.$nextTick(() => {
185+
store.disableScrollBehavior = false
186+
})
187+
})
181188
return
182189
}
183190
}

0 commit comments

Comments
 (0)