vue-tabs

A Vue.js tabs framework (多tab页轻型框架)
12,177 148
Install
npm install vue-tabs
Latest Version:0.3.1
Vue:2
License:Apache License v2.0
Last Updated:Jun 25, 2018
Links: GitHub  ·  npm
Maintainer: alexqdjay

Vue-Tabs

A Vue.js tabs framework replacing the URL-ROUTER for Vue2.0 (多tab页轻型框架,在多tab系统中替代路由)

Demo

查看 DEMO

image

Usage

Step1. config

// tabs.js
// config
import Hello from './components/Hello'
export default [{
    name: 'home', // name UNIQUE
    title: '首页', // tab's title
    component: Hello
}, {
    name: 'test1',
    title: '测试1',
    component: {
        template: '<h2>测试1</h2>'
    }
}]

Step2. New instance & use

import VueTaber from 'vue-tabs'
import '../vue-tabs.css'
import tabs from './tabs.js'

const vueTaber = new VueTaber({
    tabs
})

Vue.use(VueTaber)
new Vue({
    el: '#app',
    taber: vueTaber,
    template: '<App/>',
    components: {
        App
    }
})

Step3. Html Element

<div id="app">
<vue-tabs></vue-tabs>
</div>

Step4. Use api to open a tab

this.$taber.open({
    name: item.name
})

Contributing

Contributing

Related Packages

vue-tmn-tabs

The main idea of this package is to have a standalone tabs component that provid...

4,031 8
rocketvueappframework

A series of Vue Components and Plugins that help speed up general app developmen...

1,880 1
vue-router-tab

Vue.js tab components, based on Vue Router

15,586 474
cheetah-framework

Cheetah Framework JS used in all our applications

4,852

Version History

Version Released Vue License
0.3.1 ^2.5.2 Apache License v2.0
0.3.0 ^2.5.2 Apache License v2.0
0.2.1 ~2.4.0 Apache License v2.0
0.2.0 ^2.0.0
0.1.0 ^2.0.0