Nuxt.js 布局未添加到路线

Question

我正在尝试将我的布局应用到其他页面，但未添加。它在 IndexPage 上工作正常，但在其他路由器上却不行我在 layouts/publicLayout.vue

上有我的布局文件

<template lang="pug">
    .layout(class="overflow-x-hidden")
        NavBarMobileNavBar.relative.z-50(v-if="isMobile")
        NavBar(v-else)
        Nuxt
        Footer
</template>

<script lang="ts">
import { Vue, Component } from 'nuxt-property-decorator'
@Component({
  name: 'publicLayout'
})

这是应用布局的 IndexPage 代码：

<template lang="pug">
main.bg-gray-50
  section#hero.w-full.flex
 html/pug code...
</template>

<script lang="ts">
import { Vue, Component } from 'nuxt-property-decorator'
@Component({
  name: 'IndexPage',
  layout: 'publicLayout'
})

我在另一个名为 /services 的页面上做了同样的事情，但它并没有全部应用：

<template lang="pug">
    .w-full.h-96.bg-red-400.text-center
        h1 Services
</template>

<script lang="ts">
import { Vue, Component } from 'nuxt-property-decorator'
@Component({
  layout: 'publicLayout'
})

当我打开 Devtools 时，它显示了这个：.nuxtLayoutDefault.vue

而不是：PublicLayout

Answer 1

现在可以了。我刚刚注意到我没有关闭 /services 页面

上的 </scrpit> 标签

Nuxt.js 布局未添加到路线

Nuxt.js Layout not being added to routes

layout

vue.js

nuxt.js