Breadcrumb
Breadcrumb (브레드크럼)
출처: 문서
본문
Breadcrumb
현재 페이지의 위치를 표시해서 뒤로 돌아가기 쉽게 만들어줘요.
기본 사용법
el-breadcrumb 안에서 각 el-breadcrumb-item은 홈페이지부터 시작하는 각 레벨을 나타내는 태그예요. 이 컴포넌트는 String 속성 separator를 가지며, 이 속성이 구분자를 결정해요. 기본값은 '/'예요.
아이콘 구분자
separator-icon을 설정하면 svg 아이콘을 구분자로 사용해요. 이것은 separator를 덮어써요.
Breadcrumb API
Breadcrumb Attributes
| Name | Description | Type | Default |
|---|---|---|---|
| separator | 구분 문자 | string | / |
| separator-icon | 아이콘 구분자의 아이콘 컴포넌트 | string / Component | — |
Breadcrumb Slots
| Name | Description | Subtags |
|---|---|---|
| default | 기본 내용을 커스터마이즈해요 | Breadcrumb Item |
BreadcrumbItem API
BreadcrumbItem Attributes
| Name | Description | Type | Default |
|---|---|---|---|
| to | 링크의 대상 라우트, vue-router의 to와 같아요 | string / object | '' |
| replace | true면 탐색 기록을 남기지 않아요 | boolean | false |
BreadcrumbItem Slots
| Name | Description |
|---|---|
| default | 기본 내용을 커스터마이즈해요 |