Interface IVkCard

IVkCard Интерфейс для карточки ВКонтакте. Определяет структуру карточки, которая может быть каруселью или галереей.

Особенности:

Поддерживает два типа карточек: карусель и галерея
Может содержать множество элементов
Элементы могут иметь кнопки и действия
Поддерживает различные форматы изображений

Example

// Создание карусели с товарами
const carousel: IVkCard = {
    type: 'carousel',
    elements: [
        {
            title: 'Товар 1',
            description: 'Описание 1',
            photo_id: '123456789',
            buttons: [{ action: { type: 'text', label: 'Купить' } }]
        },
        {
            title: 'Товар 2',
            description: 'Описание 2',
            photo_id: '987654321',
            buttons: [{ action: { type: 'text', label: 'Купить' } }]
        }
    ]
};

// Создание галереи фотографий
const gallery: IVkCard = {
    type: 'gallery',
    elements: [
        {
            title: 'Фото 1',
            description: 'Описание 1',
            photo_id: '123456789',
            action: { type: 'open_photo' }
        },
        {
            title: 'Фото 2',
            description: 'Описание 2',
            photo_id: '987654321',
            action: { type: 'open_photo' }
        }
    ]
};

interface IVkCard {
type: string;
elements: IVkCardElement[];
}

Index

Properties

type elements

Properties

type

type: string

Тип карточки. Может быть 'carousel' для карусели или 'gallery' для галереи.

Особенности:

Карусель: элементы можно листать горизонтально
Галерея: элементы отображаются в сетке
Тип определяет способ отображения элементов

Example

// Карусель товаров
type: 'carousel'

// Галерея фотографий
type: 'gallery'

elements

elements: IVkCardElement[]

Массив элементов карточки. Каждый элемент представляет собой отдельную карточку в карусели.

Особенности:

Может содержать множество элементов
Каждый элемент имеет свои настройки
Элементы отображаются в зависимости от типа карточки

Example

// Элементы карусели
elements: [
    { title: 'Товар 1', description: 'Описание 1', photo_id: '123456789' },
    { title: 'Товар 2', description: 'Описание 2', photo_id: '987654321' }
]

// Элементы галереи
elements: [
    { title: 'Фото 1', description: 'Описание 1', photo_id: '123456789' },
    { title: 'Фото 2', description: 'Описание 2', photo_id: '987654321' }
]

Interface IVkCard

Example

Index

Properties

Properties

type

Example

elements

Example

Settings

On This Page