1 Star 0 Fork 36

zhgf / vue-tab

forked from alex qian / vue-tab 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
vue-tabs.min.js 6.50 KB
一键复制 编辑 原始数据 按行查看 历史
alex qian 提交于 2017-12-11 08:59 . add vue-tabs.css to package.json
/**
* vue-tabs v0.3.1
* (c) 2017 ALEXQDJAY
* mail: alexqdjay@126.com
* @license Apache2
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.VueTaber=e()}(this,function(){"use strict";function t(t){return!!t&&"function"==typeof t}function e(t){return!!t&&"string"==typeof t}function n(t){return!!t&&"[object Object]"===Object.prototype.toString.call(t)}function a(t,e){if(void 0===e&&(e=""),n(t)){var a=t.name,o=t.key;return void 0===o&&(o=""),a+"/"+o}return t+"/"+e}function o(t){o.installed||(o.installed=!0,Object.defineProperty(t.prototype,"$taber",{get:function(){return this.$root._taber}}),Object.defineProperty(t.prototype,"$tab",{get:function(){return this.$options.$tab}}),u.methods.getVue=function(){return t},t.component("VueTabs",u),t.mixin({beforeCreate:function(){this.$options.taber?this._taber=this.$options.taber:this.$options.__taber&&(this._taber=this.$options.__taber)}}))}var i={save:function(t,e){t&&e&&(window.localStorage[t]=JSON.stringify(e))},get:function(t){var e=window.localStorage[t];return e?JSON.parse(e):null}},s={STORE_KEY:"$TABS"},r={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("li",{"class":{active:t.tabData.active,loading:t.tabData.loading}},[t._v(t._s(t.tabData.meta.title)),n("span",{staticClass:"btn-close",on:{click:function(e){e.stopPropagation(),t.close(e)}}},[t._v("×")])])},staticRenderFns:[],props:{tabData:Object},methods:{close:function(){this.$emit("close",this.tabData)}}},c="vue-tabs-active-change",l="vue-tabs-close",f={},u={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"vue-tabs"},[n("div",{staticClass:"tabs-list-wrapper"},[n("ul",{staticClass:"tabs-list"},t._l(t.tabs,function(e,a){return n("tab",{key:a,attrs:{"tab-data":e},on:{close:function(n){t.close(e)}},nativeOn:{click:function(n){t.clickTab(e)}}})}))]),t._v(" "),n("div",{ref:"contentWrapEl",staticClass:"tabs-content-wrapper"})])},staticRenderFns:[],components:{Tab:r},data:function(){return{tabs:[],active:null}},beforeCreate:function(){this.tabSize=0,this.tabMap={}},created:function(){this.$taber.vm=this},mounted:function(){this.$taber.mounted()},methods:{appendContent:function(e){function n(t){var n=document.createElement("div");i.$refs.contentWrapEl.appendChild(n);var a=new t({el:n,__taber:i.$taber,parent:i,$tab:e});e.content=a,a.$el.classList.add("tabs-content")}var a,o=f[e.name],i=this;if(o)a=Promise.resolve(o);else if(t(e.meta.component)){var s=e.meta.component;this.$set(e,"loading",!0),a=new Promise(s).then(function(t){return t.__esModule&&(t=t["default"]),f[e.name]=i.getVue().extend(t)})}else a=Promise.resolve(e.meta.component).then(function(t){return f[e.name]=i.getVue().extend(t)});return a.then(function(t){n(t)}),a},clickTab:function(t){t&&!t.active&&this.select(t)},close:function(e){function n(t){null==t&&i[++s].call(r,e,n)}function o(){if(e.content.$destroy(),e.content.$el.remove)e.content.$el.remove();else{if(!e.content.$el.removeNode)throw"Element has no method named remove or removeNode";e.content.$el.removeNode(!0)}this.tabMap[a(e)]=null;var t=this.tabs.indexOf(e);t!==-1&&(this.tabs.splice(t,1),this.tabs.length>0&&this.active===e?t<this.tabs.length?this.select(this.tabs[t]):this.select(this.tabs[this.tabs.length-1]):0===this.tabs.length&&(this.$emit(c,null,e),this._saveTabs()),this.$emit(l,e))}if(e){var i=[].concat(this.$taber.beforeCloseHooks);e.meta.beforeClose&&t(e.meta.beforeClose)&&i.push(e.meta.beforeClose),i.push(o);var s=0,r=this;i[0].call(r,e,n)}},create:function(o){var i=this,s=[].concat(this.$taber.beforeCreateHooks);o.meta.beforeCreate&&t(o.meta.beforeCreate)&&s.push(o.meta.beforeCreate);var r=0,c=this,l=function(t){if(null==t)s[++r].call(c,o,l);else{if(t===!1)return;e(t)&&t===o.name?s[++r].call(c,o,l):n(t)&&t.name===o.name?s[++r].call(c,o,l):c.$taber.open(t)}};s.push(function(){i.tabs.push(o);var t=i.appendContent(o).then(function(){i.$set(o,"loading",!1)});o.promise=t,o.active!==!1?i.select(o):i._saveTabs();var e=a(o.name,o.key);i.tabMap[e]=o,l=null,s=null}),s[0].call(this,o,l)},findOpenTab:function(t,e){var n=a(t,e);return this.tabMap[n]},select:function(t){var e=this;if(t){this.$set(t,"active",!0),this.$emit(c,t,this.active),this.active=t,this.tabs.forEach(function(n){a(n.name,n.key)!==a(t.name,t.key)&&(e.$set(n,"active",!1),n.content&&n.content.$el&&n.content.$el.classList.remove("active"))}),this._saveTabs();var n=t.promise;n||(n=Promise.resolve()),n.then(function(){t.active&&t.content&&(t.content.$el.classList.add("active"),t.promise=null)})}},_saveTabs:function(){if(this.$taber.persist){var t=this.tabs.map(function(t){return{name:t.name,key:t.key,params:t.params,active:t.active}});i.save(s.STORE_KEY,t)}}}},h=["vue-tabs-close","vue-tabs-active-change"],v=function(t){var e=this,n=t.tabs,a=t.persist;this._tabsMap={},n.forEach(function(t){e._tabsMap[t.name]=t}),this.beforeCreateHooks=[],this.beforeCloseHooks=[],this._events={},this.persist=a},p={vm:{}};return v.prototype.findTab=function(t){if(!t)return null;var n;return n=e(t)?t:t.name,this._tabsMap[n]},v.prototype.open=function(t){e(t)&&(t={name:t});var n=this.findTab(t);if(!n)return void console.error("The Tab ["+t.name+"] is not defined!");t.meta=n;var a=this.vm.findOpenTab(t.name,t.key);a?this.vm.select(a):this.vm.create(t)},v.prototype.close=function(t){e(t)&&(t={name:t});var n=this.findTab(t);if(!n)return void console.error("The Tab ["+t.name+"] is not defined!");t.meta=n;var a=this.vm.findOpenTab(t.name,t.key);this.vm.close(a)},v.prototype.select=function(t){e(t)&&(t={name:t});var n=this.vm.findOpenTab(t.name,t.key);this.vm.select(n)},v.prototype.$on=function(e,n){return e&&t(n)?(this._events[e]||(this._events[e]=[]),void this._events[e].push(n)):void console.error("$on error event:["+e+"], call:"+n)},v.prototype.$off=function(t,e){if(t){var n=this._events[t]||[];if(e){var a=n.indexOf(e);a!==-1&&n.splice(a,1)}else this._events[t]=[]}},v.prototype.beforeCreateEach=function(e){t(e)&&this.beforeCreateHooks.push(e)},v.prototype.beforeCloseEach=function(e){t(e)&&this.beforeCloseHooks.push(e)},v.prototype._restoreTabs=function(){var t=this;if(this.persist){var e=i.get(s.STORE_KEY);e&&e.forEach(function(e){t.open(e)})}},v.prototype.mounted=function(){this._restoreTabs()},p.vm.set=function(t){var e=this;this._vm=t;var n=this;h.forEach(function(a){t.$on(a,function(){for(var t=[],o=arguments.length;o--;)t[o]=arguments[o];var i=e._events[a]||[];i.forEach(function(e){e.apply(n,t)})})})},p.vm.get=function(){return this._vm},Object.defineProperties(v.prototype,p),v.install=o,window.Vue&&window.Vue.use(v),v});
JavaScript
1
https://gitee.com/zhgf01/vue-tab.git
git@gitee.com:zhgf01/vue-tab.git
zhgf01
vue-tab
vue-tab
master

搜索帮助