v-tab-bar
A Vue Tab Bar Navigator
Installation
Using yarn
yarn add v-tab-bar
Using npm
npm i --save v-tab-bar
DEMO
Usage
Bundler (Webpack, Rollup)
import Vue from 'vue' import VTabBar from 'v-tab-bar' // You need a specific loader for CSS files like https://github.com/webpack/css-loader import 'v-tab-bar/dist/v-tab-bar.css' Vue.use(VTabBar)
Browser
<!-- Include after Vue --> <link rel="stylesheet" href="v-tab-bar/dist/v-tab-bar.css"></link> <script src="v-tab-bar/dist/v-tab-bar.js"></script>
Example
<router-view class="v-tab-bar-router-view"></router-view> <v-tab-bar> <v-tab-bar-item to="/home" label="Home"> <i class="fa fa-home"></i> </v-tab-bar-item> <v-tab-bar-item to="/list" label="List"> <i class="fa fa-list"></i> </v-tab-bar-item> <v-tab-bar-item to="/account" label="Account"> <i class="fa fa-user"></i> </v-tab-bar-item> <v-tab-bar-item to="/config"> <i class="fa fa-bars"></i> </v-tab-bar-item> <v-tab-bar-item to="/options" label="Options"> <i class="fa fa-cog"></i> </v-tab-bar-item> </v-tab-bar>
Development
Start demo/development environment
$ yarn start
Demo dist
$ yarn dist:demo
Dist
$ yarn dist
Contribution
You're free to contribute to this project by submitting issues and/or pull requests
License
This project is licensed under MIT License