Button
Кнопки могут отображаться в нескольких размерах и цветах, могут содержать текст и/или иконку.
Button
Использование
Компонент Button
может содержать текст, который указывается в
свойстве text
, или любой контент напрямую через children
.
Свойство text можно использовать вместе со свойствами contentLeft
и contentRight
.
С их помощью можно размещать иконку слева или справа от текста.
Примеры
Размер кнопки
Размер кнопки задается с помощью свойства size
.
Вид кнопки
Вид кнопки задается с помощью свойства view
. Возможные значения свойства view
:
"default"
– по умолчанию;"primary"
– основная;"secondary"
– вторичная;"success"
– успешное завершение;"warning"
– предупреждение;"critical"
– ошибка;"clear"
– без цветового сопровождения;"dark"
– темная;"black"
– черная;"white"
– белая.
Границы кнопки
Границы кнопки задаются с помощью свойства pin
. Возможные значения свойства pin
:
square
– обычное скругление;circle
– сильное скругление;clear
– нет скругления.
Квадратные и круглые кнопки
Для отображения иконок и/или текста в квадратных или круглых кнопках с равными сторонами,
используйте компонент Button
и свойство contentLeft
, в которое требуется передать нужное значение.
По умолчанию границы кнопки квадратные (со скругленными углами) — pin="square-square"
.
Круглые границы кнопки можно сделать с помощью свойства pin
со значением "circle-circle"
.
Гиперссылка
Компонент поддерживает вывод в виде тега <a>
, для этого необходимо указать свойство as
: