孩子使用与父母不同的布局

Question

在Nuxt中如何使用父级的Difrrent布局

例如_个人资料页面a页面b配置文件使用布局A因此，自动布局页面a和页面b使用布局a但我想在页面a和页面b中使用布局B

Answer 1

如何使用父级的Difrrent布局

首先，在layouts文件夹中创建一个新的布局B，例如：

layoutb.vue

<template>
  <div class="layoutb">
    <Nuxt />
  </div>
</template>

接下来，我们可以在页面组件（layout和pagea.vue）中使用pagea.vue键来定义要使用的布局：

pagea.vue

export default {
  layout: 'layoutb',
  ...
}

pageb.vue

export default {
  layout: 'layoutb',
  ...
}

现在您将看到使用布局B而不是布局A的页面a和页面b。