The v-breadcrumbs
component is a navigational helper for pages. It can accept a Material Icons icon or text characters as a divider. An array of objects can be passed to the items property of the component. Additionally, slots exists for more control of the breadcrumbs, either utilizing v-breadcrumbs-item
or other custom markup.
By default v-breadcrumbs
will disable all crumbs up to the current page in a nested paths. You can prevent this behavior by using exact: true
on each applicable breadcrumb in the items
array.
Выберите нужный компонент ниже и посмотрите доступные параметры, слоты, события и функции.
Применить в компоненте тёмную тему. Вы можете найти больше информации в документации Material Design для [тёмных тем оформления] (https://material.io/design/color/dark-theme.html).
Specifies the dividing character between items.
An array of objects for each breadcrumb.
[
{
disabled: boolean
exact: boolean
href: string
link: boolean
text: string | number
to: string | object
}
]
Increase the font-size of the breadcrumb item text to 16px (14px default).
Applies the light theme variant to the component.
Слот Vue по умолчанию.
The slot used for dividers.
The slot used to override default v-breadcrumbs-item
behavior when using the items prop.
{
item: any[]
}
0 12px !default;
0 1 auto !default;
14px !default;
16px !default;
0 !default;
0 14px !default;
Ниже приведена коллекция простых и сложных примеров.
Large breadcrumbs have larger font size.
Breadcrumbs separator can be set using divider
property.
Для варианта иконок breadcrumbs могут использовать любую икону из иконок Material Design.
You can use the item
slot to customize each breadcrumb.
Готовы к большему? Продолжить чтение с: