转载

Git 项目推荐 | Vue 的多 tab 页框架 vue-tab

Vue-Tabs

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

Documentation

Demo

查看 DEMO

Git 项目推荐 | Vue 的多 tab 页框架 vue-tab

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

原文 https://git.oschina.net/alexqdjay/vue-tab

正文到此结束

所属分类：编程技术

本文标签： git example CSS id tab Document IO 测试 HTML js http App https src API
版权声明： 本文为互联网转载文章，出处已在文章中说明(部分除外)。如果侵权，请联系本站长删除，谢谢。
本文海报： 生成海报一生成海报二

其他链接

关于本站

本站定位：个人技术类博客

本站作用：写博客、记日志、闲聊扯淡鼓捣技术。

问题交流

Git 项目推荐 | Vue 的多 tab 页框架 vue-tab

Vue-Tabs

Demo

Usage

Step1. config

Step2. New instance & use

Step3. Html Element

Step4. Use api to open a tab

Contributing

热门推荐

相关文章

说给你听

本文目录

随机标签

书籍教程

近期评论

网站信息

其他链接

关于本站

问题交流