Nuxt.js-在页面中添加两个布局

2022-03-28 00:00:00 vue.js vue-router nuxt.js

我是Nuxt.js的初学者,我正在将Vue的一个项目转换为Nuxt.js,我想在一个页面上使用两个布局(默认布局和另一个布局)。逻辑是这样的: 第一个布局是所有页面上的(默认)或页眉,第二个布局是设置栏。
在设置页面中,我有3条路线(参见项目结构:image):

  1. 设置/头像
  2. 设置/帐户
  3. 设置/关于

我希望三个路由的设置栏相同。我可以将设置栏添加到所有三个子页面,如:layout: 'settings-bar',但无法设置标题布局。在我的Vue项目中,我只使用了设置页面:设置栏组件和下面的<router-view></router-view>来更改组件。你知道我该怎么做吗?在文件里什么都找不到。请查看此处的其他屏幕截图以更好地了解:


解决方案

不可能在一个页面上有多个布局。但是,您所描述的内容可以使用Child Components进行管理。

相关文章