vue-side-bar

A simple, menu side bar for VueJS (2.x)

Demo Site Font awesome

Getting Started

Prerequisites

The plugin is meant to be used with existing Vue 2.x projects. It uses ES6 features so as long as your build process includes a transpiler, you're good to go.

Github

GitHub

Installing

Install with npm:

npm install --save vue-side-bar

import into project:

import Vue from 'vue'
import VueSideBar from 'vue-side-bar'

Vue.use(VueSideBar)

Example Usage

<template>
  <div>
    <vue-side-bar :menus="links"></vue-side-bar>
  </div>
</template>

<script>
  import Vue from 'vue'
  import VueSideBar from 'vue-side-bar'
  Vue.use(VueSideBar)
  export default {
    data(){
      return {
          links: [
              { title: 'Google Search', url: 'http://www.google.com', target: '_black', icon: 'fa fa-google-plus'},
              { title: 'Yahoo Search', url: 'http://www.yahoo.com', target: '_black', icon: 'fa fa-yahoo'},
              { title: 'Facebook', url: 'http://www.facebook.com', target: '_black', icon: 'fa fa-facebook'},
              { title: 'Flickr', url: 'http://www.flickr.com', target: '_black', icon: 'fa fa-flickr'}
          ]
      }
    }
  }
</script>

Component Options

Option	Description	Type, Example
menus	Array containing objects	[ { title: String, url: String, target: String (optional), icon: String (optional) *import libs icon <-set class icon, } //... ]

Authors

• Heber Almeida - Initial work - heberalmeida

License

This project is licensed under the MIT License