Nuxt.js 中的无限动态级别嵌套

Question

我希望 nuxt.js 的路由完全动态，因为我无法预测用户和他对他想要的级别数量的偏好。

所以一个用户会创建一个这样的页面：
http://localhost/parent/level-1/level-2/

还有其他人会这样做：
http://localhost/parent/level-1/level-2/level-3/level-4/level-5/level-6/level-7/

nuxt.js 有没有办法处理这个无限嵌套的路由？

Answer 1

你应该只能制作一个文件：

pages/_.vue

这将捕获与更具体的请求不匹配的任何请求。

但请注意，这会产生意想不到的后果。例如，您可能希望返回 404 错误等，并且使用此方法将始终导致匹配任何路由。这让开发人员决定如何处理丢失的页面。

Answer 2

我正在回答我自己的评论——“如何根据给定的答案验证完全动态的 url——> 使用 _.vue，然后它会处理所有事情。 也许它对某人有帮助。

每当您在 validate 方法中 return false 时，向 _.vue 模板添加验证都会返回错误页面。 在我的情况下，我每页都有一个 api 端点，可以通过将以下内容添加到 _.vue 页面组件来验证完全动态的 url：

async validate({ $axios, route }) {
    const url = getMyApiEndpointUrl(route.path)

    try {
        await $axios.$head(url)
        return true
    } catch (e) {
        return false
    }
}