КРЕАТИВНЫЕ САЙТЫ И ПРИЛОЖЕНИЯ,
КАЧЕСТВЕННЫЕ WEB-УСЛУГИ
phone

SwAlert

Функция / Компонент `SwAlert`
система всплываюших сообщений

SwAlert

Функция / Компонент SwAlert система всплывающих сообщений. Сообщения могут быть с разным типом и временем показа. Могут иметь футер с кнопками.

Свойства / Properties

ИмяТиппо умолчаниюЗначения/Описание
classStringsw-alertДобавляет пользовательский CSS-класс к компоненту.
sizeString``Размер сообщения: 'large', 'small'.
typeStringinfoТип сообщения: 'primary', 'success', 'info', 'warning', 'danger'.
messageStringDefault messageСамо сообщение.
durationNumber6000Время отображения в миллисекундах.
beforeString``Название svg в спрайте загружаемое в начале.
afterString``Название svg в спрайте загружаемое в конце (кнопка закрыть).

Слоты / Slots

#prefix - Вставка перед текстом (если не передан before) #suffix - Вставка после текста (если не передан after) #footer - Нижний блок

Пример использования / Example Usage

// .js addons
import { Alert, components } from "@studio-west/component-sw"
import { h } from 'vue'
Alert({message: 'Message', type: 'danger', duration:10000, before:'bell', footer: h(components.SwButton, { onClick: () => console.log('Клик по кнопке в футере') }, () => 'OK')})

// Composition API else <script setup>:
import { inject, h } from "vue"
const Alert = inject('Alert')
Alert({message: 'Alarm!', type: 'warning', suffix: h(components.SwgIcon, { name: 'info-circle' })})
//Options API:
this.$Alert({message: 'Welcome!', type: 'success', prefix: 'Дополнительная информация'});