# v-slot

## v-slot

**Сокращение:** `#`

**Принимает:** JavaScript выражение, допустимое в позиции аргумента (можно использовать деструктуризацию в поддерживаемых окружениях). Опционально — требуется только в случае, когда используются входные параметры у слота.

**Параметр:** имя слота (опционально, по умолчанию `default`)

**Ограничение:**

* `<template>`
* компоненты (для одиночного слота по умолчанию с входными параметрами)

**Использование:**

Указывает именованные слоты или слоты с входными параметрами.

**Пример:**

```markup
<!-- Именованные слоты -->
<base-layout>
  <template v-slot:header>
    Содержимое заголовка
  </template>

  Содержимое слота по умолчанию

  <template v-slot:footer>
    Содержимое подвала
  </template>
</base-layout>

<!-- Именованный слот с входными параметрами -->
<infinite-scroll>
  <template v-slot:item="slotProps">
    <div class="item">
      {{ slotProps.item.text }}
    </div>
  </template>
</infinite-scroll>

<!-- Слот по умолчанию с входными параметрами, с использованием деструктурирования -->
<mouse-position v-slot="{ x, y }">
  Позиция курсора: {{ x }}, {{ y }}
</mouse-position>
```