应用路由 | Quasar 框架 - Quasar 中文

Quasar CLI 与 Webpack - @quasar/app-webpack

应用路由

您会注意到您的 Quasar 项目包含一个 /src/router 文件夹。它包含您网站/应用的路由配置

“/src/router/index.js” 包含 Vue Router 初始化代码
“/src/router/routes.js” 包含您网站/应用的路由

警告

Quasar 文档假设您已经熟悉 Vue Router。下面仅描述了如何在 Quasar CLI 项目中使用它的基础知识。有关其所有功能的完整列表，请访问 Vue Router 文档。

/src/router/routes.js 需要导入您网站/应用的页面和布局。在使用布局和页面进行路由文档页面上阅读更多内容。

使用 Pinia 时，存储无法从其他脚本直接导入，但它会传递到 /src/router/index.js 的导出函数中，因此可以从那里访问它。例如，您可以使用 Router.beforeEach 方法在路由器中检查身份验证

export default function ({ store /*, ssrContext */ }) {
  // ...
  const userStore = useUserStore(store)

  Router.beforeEach((to, from, next) => {
    if (to.matched.some(record => record.meta.requiresAuth) && !userStore.isSignedIn) {
      next({ name: 'account-signin', query: { next: to.fullPath } })
    } else {
      next()
    }
  })
  // ...
}

提示

如果您正在开发 SSR 应用，那么您可以查看服务器端提供的 ssrContext 对象。

发现错误？在浏览器中编辑此页面