chore: enhance scroll behavior of header anchor

vuejs · Nov 13, 2018 · 6a20c40 · 6a20c40
1 parent 20dfd7f
commit 6a20c40
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/packages/@vuepress/core/lib/app/root-mixins/updateLoadingState.js b/packages/@vuepress/core/lib/app/root-mixins/updateLoadingState.js
@@ -15,13 +15,16 @@ export default {
       })
 
       if (this.$route.hash) {
+        const hash = decodeURIComponent(this.$route.hash)
         try {
-          const anchor = document.getElementById(this.$route.hash.slice(1))
+          const anchor = document.getElementById(hash.slice(1))
           const anchorLink = anchor.querySelector('a.header-anchor')
-          window.scroll({
-            top: anchorLink.offsetTop - 70,
-            left: 0,
-            behavior: 'auto'
+          setTimeout(() => {
+            window.scroll({
+              top: anchorLink.offsetTop - 70,
+              left: 0,
+              behavior: 'auto'
+            })
           })
         } catch (e) {
           console.error(e)

diff --git a/packages/@vuepress/plugin-active-header-links/mixin.js b/packages/@vuepress/plugin-active-header-links/mixin.js
@@ -41,7 +41,7 @@ function getAnchors () {
     })
 }
 
-let freezeScrollEvent = false
+let freezeScrollEvent = true
 
 export default {
   mounted () {
@@ -53,7 +53,10 @@ export default {
     })
 
     this.$vuepress.$on('AsyncMarkdownContentMounted', (slotKey) => {
-      freezeScrollEvent = false
+      // delay activation of scroll event
+      setTimeout(() => {
+        freezeScrollEvent = false
+      }, 1000)
       if (slotKey === 'default') {
         window.addEventListener('scroll', () => this.onScroll(freezeScrollEvent))
       }