---
title: "Блок «Вкладка» — одна вкладка блока вкладок"
description: "Отдельная вкладка внутри блока вкладок: хранит название обычным текстом, необязательный эмодзи и свои дочерние блоки."
source: https://blokeditor.com/ru/docs/tab/
lastmod: 2026-10-06
---

Фреймворк JavaScript

Блочные инструменты Вкладка

# Вкладка: одна вкладка блока вкладок

Одна вкладка внутри блока вкладок. Пользователь не может вставить её сам. Вкладки создаёт и ведёт родительский блок `tabs`.

Вкладка сохраняет `title` и необязательный эмодзи `icon`, оба как обычный текст. Пустой значок не сохраняется. Дочерние блоки вкладываются во вкладку через `contentIds`. Вкладка не может содержать другой блок вкладок.

Пустая вкладка показывает «Пустая вкладка. Нажмите или перетащите блоки сюда.». Щелчок по ней добавляет во вкладку абзац.

### Импорт

TypeScript

```
import { TabTool } from '@bloklabs/core/tools';
```

### Формат данных

TypeScript

```
interface TabData {
  title: string; // Plain text label shown in the tab strip
  icon?: string; // Optional emoji shown before the title
}
// Child blocks are referenced via the block's saved `content` array
// (the in-memory `contentIds`), not stored here.
```

JSON

```
{
  "id": "tab1",
  "type": "tab",
  "data": {
    "title": "Overview",
    "icon": "📘"
  },
  "content": ["block1", "block2"]
}
```

### Пример использования

TypeScript

```
// Tab is not inserted directly — it is created by the TabsTool.
import { TabsTool, TabTool } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    tabs: { class: TabsTool },
    tab: { class: TabTool },
  },
});
```