Accordion

Компонент выпадающей информации

AccordionItem

Компонент выпадающей информации

Компонент представляет собой заголовок и контент, который раскрывается при нажатии.

Примеры Accordion

Live Editor

Result

Использование Accordion в Controlled варианте

Live Editor

Result

Использование Accordion SingleActive

Live Editor

Result

Использование Accordion с eventKey и defaultActiveEventKey

Live Editor

Result

Встроенная иконка AccordionItem

defaultIconContent задаёт вид встроенной иконки: arrow — залитая стрелка, chevron — контурный шеврон, sign — знак плюс/минус, clear — без иконки. defaultIconPlacement размещает её слева или справа.

Live Editor

Result

Использование AccordionItem с кастомной иконкой contentRight и анимацией

Если передать contentRight, компонент полностью отдаёт управление иконкой снаружи и не применяет встроенную анимацию поворота (она работает только для встроенной иконки, заданной через defaultIconContent). Чтобы анимировать кастомную иконку, нужно самостоятельно менять её стиль в зависимости от состояния opened.

Live Editor

Result