Изучите Nuxt с коллекцией из 100+ советов!

Лейаут

Nuxt Kit предоставляет набор утилит, которые помогают вам работать с лейаутами.

Лейауты используются в качестве обертки вокруг ваших страниц. Они могут использоваться для оборачивания страниц общими компонентами, например, хедером и футером. Лейауты могут быть зарегистрированы с помощью утилиты addLayout.

addLayout

Зарегистрируйте шаблон как лейаут и добавьте его в лейауты.

В Nuxt 2 лейаут error также может быть зарегистрирован с помощью этой утилиты. В Nuxt 3+ лейаут errorзаменен на страницу error.vue в корне проекта.

Тип

function addLayout (layout: NuxtTemplate | string, name: string): void

interface NuxtTemplate {
  src?: string
  filename?: string
  dst?: string
  options?: Record<string, any>
  getContents?: (data: Record<string, any>) => string | Promise<string>
  write?: boolean
}

Параметры

layout

Тип: NuxtTemplate | string

Обязательный: true

Объект шаблона или строка с путем к шаблону. Если указана строка, она будет преобразована в объект шаблона с src, установленным на значение строки. Если указан объект шаблона, он должен обладать следующими свойствами:

  • src (опционально)
    Тип: string
    Путь к шаблону. Если src не указан, вместо него следует указать getContents.
  • filename (опционально)
    Тип: string
    Имя файла шаблона. Если filename не указан, он будет сгенерирован из пути src. В этом случае опция src обязательна.
  • dst (опционально)
    Тип: string
    Путь к файлу назначения. Если dst не указан, он будет сгенерирован из пути к filename и параметра nuxt buildDir.
  • options (опционально)
    Тип: Options
    Параметры для передачи в шаблон.
  • getContents (опционально)
    Тип: (data: Options) => string | Promise<string>
    Функция, которая будет вызвана с объектом options. Она должна возвращать строку или промис, который разрешается в строку. Если указан src, эта функция будет проигнорирована.
  • write (опционально)
    Тип: boolean
    Если установлено значение true, шаблон будет записан в целевой файл. В противном случае шаблон будет использоваться только в виртуальной файловой системе.