1.0.2 • Published 4 years ago
shapla-side-navigation v1.0.2
Shapla Side Navigation
A simple side overlay navigation. Normally to use to develop admin panel.
Table of contents
Installation
npm i shapla-side-navigation
Usage
Add the component:
import sideNavigation from 'shapla-side-navigation';
export default {
name: 'Hello',
components: {
sideNavigation
}
}
<side-navigation :active="true" nav-width="300px" position="left" :show-overlay="true">
Nav content goes here
</side-navigation>
Props
Property | Type | Required | Default | Description |
---|---|---|---|---|
active | Boolean | no | true | If set true , side navigation will be opened. |
showOverlay | Boolean | no | true | If set true , overlay background will be shown |
navWidth | String | no | 300px | Sidenav width in pixels. |
position | String | no | left | Value can be left or right . |
Listeners
The side navigation component fires the following events:
close
: When outside area is clicked, it fires the event.
<!-- template -->
<side-navigation @close="handleClose"></side-navigation>
<!-- method -->
methods: {
handleClose(){
// Handle close event
}
}