Notifications
Отображает всплывающее уведомление
Вместо этого компонента может использоваться метод addMessage библиотеки FrontendCore. Примеры испо льзования метода addMessage представлены на странице.
/* устарело: */
<Notifications
Value={[{
id:'1',
message: 'Notification ',
timeout: 100
}]}
Mode="TopRight"
ShowDuplicatedTitles={true}
/>
/* новый способ: */
<Button
OnClick={()=>addMessage('Уведомление', { variant: 'warning' }); }
Text={"Уведомление"}
/>
Свойства
Имя | Описание | Тип | Значение по умолчанию | Возможные значения |
---|---|---|---|---|
Badge | Количественная информация в компонентах Menu, Accordion, Link, Text. В качестве значения может использоваться объект с полями: counter (число), position ("post" или "pre"), color (цвет) | any | ||
CSS | Массив строк-классов CSS-стилей компонента | array | ||
CombineConfig | Конфигурация всех событий компонента. Служебное свойство для генерации фрагментов кода в визуальном режиме редактора форм. Не рекомендуется указывать значение вручную | object | ||
Hidden | Признак состояния компонента Скрыт | boolean | False | |
Hint | Всплывающая подсказка над компонентом, чаще используемая для подробного пояснения краткого текста | any | ||
Id | Идентификатор компонента для навигации к нему на HTML-странице | string | ||
Mode | Позиция отображения всплывающего уведомления | enum | TopRight | TopRight - Вверху справаTopLeft - Вверху слеваBottomRight - Внизу справаBottomLeft - Внизу слева |
OnClick | Обработчик события нажатия кнопки мыши | undefined | ||
OnKeyDown | Обработчик собы тия KeyDown | undefined | ||
OnKeyUp | Обработчик события KeyUp | undefined | ||
OnMouseDown | Обработчик события MouseDown | undefined | ||
OnMouseEnter | Обработчик события MouseEnter | undefined | ||
OnMouseLeave | Обработчик события MouseLeave | undefined | ||
OnMouseMove | Обработчик события MouseMove | undefined | ||
OnMouseOut | Обработчик события MouseOut | undefined | ||
OnMouseOver | Обработчик события MouseOver | undefined | ||
OnMouseUp | Обработчик события MouseUp | undefined | ||
OnUnmount | Обработчик события Unmount | undefined | ||
ShowDuplicatedTitles | Признак отображения одинаковых уведомлений | boolean | False | |
Slot | Метка для динамического добавления другого компонента по его идентификатору | string | ||
Tooltip | Всплывающая подсказка над компонентом, чаще используемая для пояснения назначения значка | any | ||
TraceId | Идентификатор для отслеживания состояния компонента исходя из хронологической последовательности: создание, отрисовка, обновление, удаление; используе тся для выполнения фрагмента кода по изменению состояния компонента | string | ||
Value | Mассив уведомлений: объекты вида { id, message, isError, timeout } | array | ||
Visible | Признак инверсии состояния компонента Скрыт | boolean | True |
Примеры
JSX:
<Group Mode={"Column"}>
/* устарело: */
<Notifications
Value={[{
id:'1',
message: 'Notification ',
timeout: 100
}]}
Mode="TopRight"
ShowDuplicatedTitles={true}
/>
/* новый способ: */
<Button
OnClick={()=>addMessage('Уведомление', { variant: 'warning' })}
Text={"Уведомление"}
CSS={['mb-32']}
/>
<Link Mode="InternalLink" Value="p/examples/messages/" Text="Подробнее смотрите здесь" />
</Group>