Vue.js 사이드바 메뉴 구성요소
vue-sidebar-menu.A Vue.js 사이드바 메뉴 컴포넌트
데모
4.0.0의 새로운 기능
CSS, SASS 변수를 리팩토링하고 새로운 클래스를 추가하여 훨씬 쉽게 사용자 정의
제거됨 |_+_| 이벤트(대신 |_+_| 사용)
이름 바꾸기 |_+_| 이벤트 |_+_|
이름 바꾸기 |_+_| 슬롯 |_+_|
구성 요소 항목에는 더 이상 헤더 속성이 필요하지 않습니다.
헤더 항목 및 구성 요소 항목은 자식 항목 내에서 사용할 수 있습니다.
새 속성 추가 |_+_| & |_+_| 제거됨 |_+_| 속성(대신 |_+_| 사용)
새로운 소품 추가 |_+_|: 사이드바를 상위 항목에 상대적으로 만듭니다(기본적으로 사이드바는 뷰포트에 상대적임).
새로운 소품 추가 |_+_|: 숨김 토글 축소 btn
설치
itemClick
플러그인을 전역적으로 설치합니다.
item-click
또는 구성 요소를 로컬로 가져옵니다.
collapse
기본 사용법
toggle-collapse
항목 속성
collapse-icon
Vue 라우터 지원
vue-router를 사용하는 경우 |_+_| 하이퍼링크 대신 사용됩니다 |_+_|
소품
toggle-icon
이벤트
hidden
@toggle-collapse(접힌) 토글 btn 클릭 시 트리거
@item-click(이벤트, 아이템) 항목 링크 클릭 시 트리거
스타일
모든 스타일 사용자 정의는 이 클래스를 사용하여 일반 CSS에서 수행할 수 있습니다.
hiddenOnCollapse
또는 Sass 변수를 재정의하고 고유한 테마를 만들 수 있습니다.
visibleOnCollapse
아이콘 사용자 정의
구성 요소 사용 |_+_| 아이콘의 기본값이지만 슬롯을 사용하여 사용자 정의할 수 있습니다.
슬롯
hiddenOnCollapse
개발
relative
다운로드 세부 정보:
작가: 야민코
라이브 데모: https://yaminncco.github.io/vue-sidebar-menu/
깃허브: https://github.com/yaminncco/vue-sidebar-menu
#vuejs #자바스크립트 # vue-js