2.1 KiB
2.1 KiB
Breadcrumb
Muestra la localización de la página actual, haciendo más fácil el poder ir a la página anterior.
Uso básico
:::demo En el-breadcrumb
, cada el-breadcrumb-item
es un tag que representa cada nivel empezando desde la homepage. Este componente tiene un atributo String
llamado separator
, el mismo determina el carácter separador. El valor por defecto es '/'.
<el-breadcrumb separator="/">
<el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>
<el-breadcrumb-item><a href="/">promotion management</a></el-breadcrumb-item>
<el-breadcrumb-item>promotion list</el-breadcrumb-item>
<el-breadcrumb-item>promotion detail</el-breadcrumb-item>
</el-breadcrumb>
:::
Icono separador
:::demo Setee separator-class
para que utilice iconfont
como separador,el mismo va a cubrir separator
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>
<el-breadcrumb-item>promotion management</el-breadcrumb-item>
<el-breadcrumb-item>promotion list</el-breadcrumb-item>
<el-breadcrumb-item>promotion detail</el-breadcrumb-item>
</el-breadcrumb>
:::
Breadcrumb atributos
Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
---|---|---|---|---|
separator | carácter separador | string | — | / |
separator-class | nombre de la clase del icono separador | string | — | - |
Breadcrumb Item atributos
Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
---|---|---|---|---|
to | ruta del link, lo mismo que to de vue-router |
string/object | — | — |
replace | si true , la navegación no dejara una entrada en la historia |
boolean | — | false |