nuxtjs

Question

我正在开发一个包含两个部分的 Nuxt 应用程序。管理面板（页面位于 pages/admin/* 内）和普通用户的其余页面（位于 pages 目录的根目录内）。我正在使用以下中间件为整个“/admin/”URL 关闭 SSR：

export default function(req, res, next) {
  const currentPaths = req.originalUrl
  if (currentPaths.includes('/admin/')) {
    res.spa = true
  }
  next()
}

由于我在管理面板中有一个 404 页面，当 404 发生时，普通用户也会重定向到此页面。那么，如何才能让普通用户拥有单独的404页面呢？

还有第二个问题：我以前关闭管理页面SSR的方式可以吗？谁能推荐更好的方法？

Answer 1

pages/admin 和/pages 的错误页面无法分开，但您实际上可以通过添加条件来检测/admin/ 路径

来显示不同的错误

<template>
  <div>
    <h3 v-if="error.statusCode === 404 && $nuxt.$route.path.indexOf('/admin/') > -1">Page not found in admin</h3>
    <h3 v-else>Page not found</h3>
  </div>
</template>

我对第二个问题没有任何经验，但是您可以先尝试构建，然后在构建模式下运行查看结果（是否包含错误）。如果您发现任何错误，您可以尝试 <client-only> 组件来包装您的管理布局

Answer 2

所以，要有不同布局的单独错误页面，我们可以有一个条件布局：

layout: (context) => context.route.path.indexOf('/admin/') > -1 ? 'default' : 'front/fullpage',

nuxtjs - 两个独立的 404 页面

nuxtjs - two separate 404 pages

vue.js

nuxt.js