eeeeeeuuuu-ui
Version:
uView UI,是uni-app生态优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水
12 lines (11 loc) • 3.82 kB
JavaScript
require('../../../app.js');
(global["webpackJsonp"]=global["webpackJsonp"]||[]).push([["uview-ui/components/u-tabs/u-tabs"],{"430c":function(t,e,i){"use strict";(function(t){e["a"]={name:"u-tabs",props:{isScroll:{type:Boolean,default:!0},list:{type:Array,default(){return[]}},current:{type:[Number,String],default:0},height:{type:[String,Number],default:80},fontSize:{type:[String,Number],default:30},duration:{type:[String,Number],default:.5},activeColor:{type:String,default:"#2979ff"},inactiveColor:{type:String,default:"#303133"},barWidth:{type:[String,Number],default:40},barHeight:{type:[String,Number],default:6},gutter:{type:[String,Number],default:30},bgColor:{type:String,default:"#ffffff"},name:{type:String,default:"name"},bold:{type:Boolean,default:!0},activeItemStyle:{type:Object,default(){return{}}},showBar:{type:Boolean,default:!0},barStyle:{type:Object,default(){return{}}},itemWidth:{type:[Number,String],default:"auto"}},data(){return{scrollLeft:0,tabQueryInfo:[],componentWidth:0,scrollBarLeft:0,parentLeft:0,id:this.$u.guid(),currentIndex:this.current,barFirstTimeMove:!0}},watch:{list(t,e){t.length!==e.length&&(this.currentIndex=0),this.$nextTick(()=>{this.init()})},current:{immediate:!0,handler(t,e){this.$nextTick(()=>{this.currentIndex=t,this.scrollByIndex()})}}},computed:{tabBarStyle(){let t={width:this.barWidth+"rpx",transform:`translate(${this.scrollBarLeft}px, -100%)`,"transition-duration":(this.barFirstTimeMove?0:this.duration)+"s","background-color":this.activeColor,height:this.barHeight+"rpx","border-radius":this.barHeight/2+"px"};return Object.assign(t,this.barStyle),t},tabItemStyle(){return t=>{let e={height:this.height+"rpx","line-height":this.height+"rpx","font-size":this.fontSize+"rpx","transition-duration":this.duration+"s",padding:this.isScroll?`0 ${this.gutter}rpx`:"",flex:this.isScroll?"auto":"1",width:this.$u.addUnit(this.itemWidth)};return t==this.currentIndex&&this.bold&&(e.fontWeight="bold"),t==this.currentIndex?(e.color=this.activeColor,e=Object.assign(e,this.activeItemStyle)):e.color=this.inactiveColor,e}}},methods:{async init(){let t=await this.$uGetRect("#"+this.id);this.parentLeft=t.left,this.componentWidth=t.width,this.getTabRect()},clickTab(t){t!=this.currentIndex&&this.$emit("change",t)},getTabRect(){let e=t.createSelectorQuery().in(this);for(let t=0;t<this.list.length;t++)e.select("#u-tab-item-"+t).fields({size:!0,rect:!0});e.exec(function(t){this.tabQueryInfo=t,this.scrollByIndex()}.bind(this))},scrollByIndex(){let e=this.tabQueryInfo[this.currentIndex];if(!e)return;let i=e.width,r=e.left-this.parentLeft,n=r-(this.componentWidth-i)/2;this.scrollLeft=n<0?0:n;let a=e.left+e.width/2-this.parentLeft;this.scrollBarLeft=a-t.upx2px(this.barWidth)/2,1==this.barFirstTimeMove&&setTimeout(()=>{this.barFirstTimeMove=!1},100)}},mounted(){this.init()}}}).call(this,i("543d")["default"])},"66e9":function(t,e,i){},ce14:function(t,e,i){"use strict";var r=i("66e9"),n=i.n(r);n.a},da4d:function(t,e,i){"use strict";var r;i.r(e);var n,a=function(){var t=this,e=t.$createElement,i=(t._self._c,t.__map(t.list,(function(e,i){var r=t.__get_orig(e),n=t.__get_style([t.tabItemStyle(i)]);return{$orig:r,s0:n}}))),r=t.showBar?t.__get_style([t.tabBarStyle]):null;t.$mp.data=Object.assign({},{$root:{l0:i,s1:r}})},s=[],l=i("430c"),h=l["a"],o=(i("ce14"),i("f0c5")),u=Object(o["a"])(h,a,s,!1,null,"949841e6",null,!1,r,n);e["default"]=u.exports}}]);
;(global["webpackJsonp"] = global["webpackJsonp"] || []).push([
'uview-ui/components/u-tabs/u-tabs-create-component',
{
'uview-ui/components/u-tabs/u-tabs-create-component':(function(module, exports, __webpack_require__){
__webpack_require__('543d')['createComponent'](__webpack_require__("da4d"))
})
},
[['uview-ui/components/u-tabs/u-tabs-create-component']]
]);