如何在vuepress中转换路线？

Question

阅读Vue Router文档，实现路由转换的方法是：

<transition>
  <router-view></router-view>
</transition>

但问题是VuePress正在处理幕后的所有路由，所以我无法弄清楚该转换组件的放置位置。

有没有在VuePress中这样做？

Answer 1

您需要创建自己的主题或eject default。

在您的Page.vue组件中，将<Content />组件包装在<transition>

中

<transition name="fade">
  <Content :custom="false"/>
</transition>

如果要更改<Content />部分以外的内容，请使用绑定

<transition name="header-fade" mode="out-in">
  <header v-bind:key="$page.key">
    <h1>{{ $page.title }}</h1>
  </header>
</transition>

Answer 2

据我所知 - 路由器转换将不可能，因为只要您运行'vuepress build'，整个站点就会是静态的。 因此，不再进行路由，因此页面将重新加载新内容，而不是动态添加它。