时间戳

首页 > 解决方案 > Nuxt child：父路由工作不正确

nuxt.js - Nuxt child：父路由工作不正确

问题描述

这是我的文件树：

pages/
-index.vue   (1)
-index/
--_id.vue    (2)

我预计：

当我没有子组件的参数时，我希望 Nuxt 子组件根本不渲染，但 Nuxtid使用undefined. Vue路由器正确地做到了。

这是类似于 Nuxt 行为的 JSFiddle：https ://jsfiddle.net/maxmets/95ctse8d/ （第 16 行path: '/:id?'）

这是我想要的 JSFiddle（Vue 路由器）：https ://jsfiddle.net/maxmets/rvmxg2f7/ （第 16 行path: '/:id'）

不同之处仅在于?符号。当 Nuxt 自动创建它添加的路由对象时? 如何使 Nuxt 路由器像 Vue 路由器一样正常工作？

标签： nuxt.jsvue-routerrouternested-routes

解决方案

你可以试试这个嵌套路由方法：

pages/
-index.vue   (1)
-index/
--_id.vue    (2)
--_index.vue    (3)

在index/index.vue中，您可以只渲染空模板

<template>
  <div></div>
</template>

这可能不是最干净的方法，但它应该可以完成工作。

或者

但是如果您选择定义自己的路由器，您可以查看Nuxt 路由器额外模块

推荐阅读