Nuxt.js-如何在布局内使用布局

Question

我的页面布局不好，我想做一个页面 带有一个布局，并且在布局内部有一个组件，可以在insdie中进行更改并更改网址到

我如何用nuxt做到这一点？

像这样的图片：

我的基本布局为红色 我的页面布局为蓝色 现在我有一个链接，并且在Dashbord中，我想在链接上单击黑框，仅由其他组件和url更改为 但是我没有再次将nuxt调用为蓝色布局

Answer 1

布局仅是一种，毫无疑问，在default.vue中，或者如果您进行了自定义，则可以调用它，您可以将导航栏与用户以及其他所有内容一起放置（红色方块），那么您的页面将成为蓝色方框内的内容，并且您可以在页面内应用动态组件（https://vuejs.org/v2/guide/components-dynamic-async.html），我认为这对您来说足够了，如果您需要进一步的说明，请告诉我； ）

干杯。

Answer 2

我遇到类似的问题，并通过使用<nuxt-child/>嵌套页面来解决。

GIF: How it works

GitHub: Nuxt.js Nested Routes Example Repository (not official)

创建一个像pages/group-foo.vue这样的父页面：

<template>
  <div>
    <!-- ... -->
    <nuxt-child />
  </div>
</template>

然后，创建一个与父页面名称相同的目录：pages/group-foo/。

---

另请参阅以下官方文件：

• Nested Routes
• Dynamic Nested Routes
• API: The Component