nuxt.js - Nuxt中如何给一组路由添加中间件

Question

根据docs : 中间件将按以下顺序依次执行:

• nuxt.config.js
• 匹配的布局
• 匹配的页面

现在我想知道如何将中间件添加到像这样的 slug 中的一组页面:

pages/
--| _slug/
-----| comments.vue
-----| index.vue

我认为有一些选择:

1) 我可以将中间件添加到目录中的每个单独页面，但这并不枯燥。

2) 另一种解决方案是将中间件添加到 nuxt.config.js在路线上有条件，但感觉也不是该代码的正确位置，除此之外它也可以在任何其他路线上运行。

3) 我也许可以将嵌套路由与仅包含一个 <nuxt-child> 的模板一起使用元素，但我不确定副作用:我还能使用页面组件属性吗？这是否将所有内容都嵌套在另一个 DOM 元素中？

感谢任何帮助。

Answer 1

好吧，我想我的“选项 3”是去这里的方式:

创建文件 _slug.vue 并将其添加到与 _slug/ 目录相同嵌套级别的页面:

pages/
--| _slug/
-----| comments.vue
-----| index.vue
--| _slug.vue

在 _slug.vue 文件中添加中间件属性:

<template>
  <nuxt-child/>
</template>

<script>
export default {
  middleware: 'myslugmiddleware',
}
</script>