feat($theme-default): display els of page bottom after content mounted

vuejs · Nov 5, 2018 · d9a8ced · d9a8ced
1 parent d658169
commit d9a8ced
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/packages/@vuepress/core/lib/app/components/Content.vue b/packages/@vuepress/core/lib/app/components/Content.vue
@@ -36,10 +36,14 @@ export default {
 
   created () {
     this.loadContent(this.$key)
+    this.$vuepress.$on('AsyncMarkdownContentMounted', (slotKey) => {
+      this.$vuepress.$set('contentMounted', true)
+    })
   },
 
   watch: {
     $key (key) {
+      this.$vuepress.$set('contentMounted', false)
       this.reloadContent(key)
     }
   },

diff --git a/packages/@vuepress/theme-default/components/Page.vue b/packages/@vuepress/theme-default/components/Page.vue
@@ -4,7 +4,7 @@
 
     <Content/>
 
-    <div class="page-edit">
+    <div class="page-edit" v-if="contentMounted">
       <div
         class="edit-link"
         v-if="editLink"
@@ -26,7 +26,7 @@
       </div>
     </div>
 
-    <div class="page-nav" v-if="prev || next">
+    <div class="page-nav" v-if="contentMounted && (prev || next)">
       <p class="inner">
         <span
           v-if="prev"
@@ -67,10 +67,11 @@ import { resolvePage, normalize, outboundRE, endingSlashRE } from '../util'
 export default {
   props: ['sidebarItems'],
 
-  data () {
-  },
-
   computed: {
+    contentMounted () {
+      return this.$vuepress.$get('contentMounted')
+    },
+
     lastUpdated () {
       if (this.$page.lastUpdated) {
         return new Date(this.$page.lastUpdated).toLocaleString(this.$lang)