SwButtonGroup
Компонент SwButtonGroup представляет собой группу кнопок с возможностью включения режима "Radio".
Свойства / Properties
| Имя | Тип | по умолчанию | Значения/Описание |
|---|---|---|---|
class | String | sw-button | Добавляет пользовательский CSS-класс к компоненту. |
vertical | Boolean | false | Вертикальное расположение кнопок. |
radio | Boolean | false | Режим "Radio" неактивные кнопки будут иметь класс 'sw-text'. |
round | Boolean | false | Делает группу кнопок визуально закругленной. |
Модель / Model
model - индекс активной кнопки.
Особенности реализации
- Автоматическое отслеживание изменений в слоте через MutationObserver
- В режиме
radioкнопки автоматически получают обработчики кликов - Динамическое обновление классов при изменении модели
Пример использования / Example Usage
<script setup>
import { ref } from 'vue'
const buttonGroupActive = ref(0)
</script>
<sw-button-group radio v-model="buttonGroupActive">
<sw-button type="primary" size="small">Один</sw-button>
<sw-button type="primary">Два</sw-button>
<sw-button type="danger">Три</sw-button>
</sw-button-group>