vue-page-stack使用

Vue Page Stack是一个轻量级的前端路由库，它基于 Vue.js 和 Vue Router，并提供了一种更简洁的方式来管理页面堆栈，常用于SPA（单页应用）中。它的核心思想是通过创建一个类似于浏览器历史记录的堆栈，当用户点击前进或后退按钮时，能够平滑地切换页面而无需刷新整个应用。

Vue Page Stack的主要特点包括：
1. **无状态**：它并不处理具体的路由数据，而是专注于导航的状态和跳转逻辑，这使得组件间的通信更为简单。
2. **可配置**：允许自定义过渡动画、命名空间等，以满足项目的个性化需求。
3. **易于使用**：使用起来相对直观，可以直接在Vue组件上操作，无需额外复杂的配置文件。

要在项目中使用Vue Page Stack，你需要先安装依赖，然后在Vue实例的`beforeCreate`钩子中初始化Page Stack，接着可以使用`push`、`pop`等方法来添加或移除页面。例如：

import { createPageStack } from 'vue-page-stack'

export default {
  setup() {
    const pageStack = createPageStack()
    
    // 当路由变化时，更新pageStack
    onRouteUpdate(to) {
      pageStack.push({
        name: to.name,
        component: () => import('./views/' + to.name + '.vue')
      })
    }
    
    return {
      pageStack
    }
  }
}