Vue.js 사이드바 메뉴 구성요소

문제를 제거하기 위해 도구를 사용해보십시오

Vue.js 사이드바 메뉴 구성요소

vue-sidebar-menu.A Vue.js 사이드바 메뉴 컴포넌트



데모

vue-sidebar-menu-demo






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