Перейти к содержимому

CoreDropdownMenu

Живой MDC-рендер и исходник для копирования.

Живой рендер

Так ContentRenderer отрисует этот контент на реальной странице.

Выпадающее меню у триггера: пункты с иконками, ссылками, разделителями задаются массивом items (JSON-биндинг :items='[…]'). Открытие по клику/hover держит компонент сам — в MDC меню рабочее без кода.

Меню действий

Пункты-ссылки

Пункт с to рендерится ссылкой, danger красит красным, divider — разделитель.

Разделы

Исходник (MDC)

Тот же код текстом — скопируйте в свой контент как есть.
MDC
Выпадающее меню у триггера: пункты с иконками, ссылками, разделителями задаются массивом `items` (JSON-биндинг `:items='[…]'`). Открытие по клику/hover держит компонент сам — в MDC меню рабочее без кода.

### Меню действий

::core-dropdown-menu{:items='[{"label":"Открыть","icon":"eye"},{"label":"Настройки","icon":"sliders-horizontal","to":"/dev/mdc/button"},{"divider":true},{"label":"Удалить","icon":"close","danger":true}]'}
  <CoreButton variant="soft">Действия</CoreButton>
::

### Пункты-ссылки

Пункт с `to` рендерится ссылкой, `danger` красит красным, `divider` — разделитель.

::core-dropdown-menu{trigger="hover" :items='[{"label":"Документация","to":"/dev/mdc"},{"label":"WoW эффекты","to":"/dev/wow"}]'}
  <CoreLink to="/dev/mdc">Разделы</CoreLink>
::