u-tabs-swiper.js.map 28.9 KB
{"version":3,"sources":["webpack:////Users/linon/work/workai/job-sharing/uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue?80b8","webpack:////Users/linon/work/workai/job-sharing/uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue?67eb","webpack:////Users/linon/work/workai/job-sharing/uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue?64a6","webpack:////Users/linon/work/workai/job-sharing/uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue?ed70","uni-app:///uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue","webpack:////Users/linon/work/workai/job-sharing/uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue?edea","webpack:////Users/linon/work/workai/job-sharing/uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue?9880"],"names":[],"mappings":"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A,CADA,EACA;AACA;AACA;AACA,KAJA;AAKA,QALA,kBAKA;AACA;AACA;AACA,OAFA;AAGA,KATA,EAhMA;;AA2MA,SA3MA,qBA2MA;AACA;AACA,GA7MA;AA8MA;AACA,QADA,kBACA;AACA,iCADA;AAEA,sCAFA;AAGA;AACA;AACA;AACA,iBAFA;AAGA;AACA,0HARA;AASA,KAVA;AAWA;AACA,eAZA,yBAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAXA;AAYA,OAjBA;AAkBA,KA/BA;AAgCA;AACA,gBAjCA,0BAiCA;AACA;AACA;AACA;AACA,KArCA;AAsCA,WAtCA,qBAsCA;AACA;AACA;AACA,KAzCA;AA0CA,QA1CA,gBA0CA,KA1CA,EA0CA;AACA;AACA,KA5CA;AA6CA,UA7CA,oBA6CA;AACA;AACA,KA/CA;AAgDA,YAhDA,oBAgDA,EAhDA,EAgDA;AACA;AACA;AACA;AACA,oBADA;;AAGA;AACA;AACA;AACA;AACA,WAHA,MAGA;AACA;AACA;AACA,SAVA;AAWA,YAXA;AAYA,OAdA,CAcA;AACA;AACA;AACA,KAlEA;AAmEA;AACA,yBApEA,mCAoEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAFA,MAEA;AACA;AACA;AACA;AACA;AACA,KAlFA;AAmFA,SAnFA,iBAmFA,EAnFA,EAmFA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAnGA;AAoGA;AACA,eArGA,uBAqGA,WArGA,EAqGA,YArGA,EAqGA,EArGA,EAqGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KA9GA;AA+GA;AACA,oBAhHA,4BAgHA,OAhHA,EAgHA;AACA;AACA;AACA;AACA;AACA;AACA,OAJA;AAKA;AACA;AACA;AACA,KA1HA,EA9MA,E;;;;;;;;;;;;;AClDA;AAAA;AAAA;AAAA;AAA6lD,CAAgB,k8CAAG,EAAC,C;;;;;;;;;;;ACAjnD;AACA,OAAO,KAAU,EAAE,kBAKd","file":"uview-ui/components/u-tabs-swiper/u-tabs-swiper.js","sourcesContent":["import { render, staticRenderFns, recyclableRender, components } from \"./u-tabs-swiper.vue?vue&type=template&id=9c8ef540&scoped=true&\"\nvar renderjs\nimport script from \"./u-tabs-swiper.vue?vue&type=script&lang=js&\"\nexport * from \"./u-tabs-swiper.vue?vue&type=script&lang=js&\"\nimport style0 from \"./u-tabs-swiper.vue?vue&type=style&index=0&id=9c8ef540&scoped=true&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"9c8ef540\",\n  null,\n  false,\n  components,\n  renderjs\n)\n\ncomponent.options.__file = \"uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue\"\nexport default component.exports","export * from \"-!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--16-0!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./u-tabs-swiper.vue?vue&type=template&id=9c8ef540&scoped=true&\"","var components\ntry {\n  components = {\n    uBadge: function() {\n      return import(\n        /* webpackChunkName: \"uview-ui/components/u-badge/u-badge\" */ \"@/uview-ui/components/u-badge/u-badge.vue\"\n      )\n    }\n  }\n} catch (e) {\n  if (\n    e.message.indexOf(\"Cannot find module\") !== -1 &&\n    e.message.indexOf(\".vue\") !== -1\n  ) {\n    console.error(e.message)\n    console.error(\"1. 排查组件名称拼写是否正确\")\n    console.error(\n      \"2. 排查组件是否符合 easycom 规范,文档:https://uniapp.dcloud.net.cn/collocation/pages?id=easycom\"\n    )\n    console.error(\n      \"3. 若组件不符合 easycom 规范,需手动引入,并在 components 中注册该组件\"\n    )\n  } else {\n    throw e\n  }\n}\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  var l0 = _vm.__map(_vm.getTabs, function(item, index) {\n    var $orig = _vm.__get_orig(item)\n\n    var s0 = _vm.__get_style([_vm.tabItemStyle(index)])\n\n    return {\n      $orig: $orig,\n      s0: s0\n    }\n  })\n\n  var s1 = _vm.showBar ? _vm.__get_style([_vm.tabBarStyle]) : null\n  _vm.$mp.data = Object.assign(\n    {},\n    {\n      $root: {\n        l0: l0,\n        s1: s1\n      }\n    }\n  )\n}\nvar recyclableRender = false\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns, recyclableRender, components }","import mod from \"-!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--12-1!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./u-tabs-swiper.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--12-1!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./u-tabs-swiper.vue?vue&type=script&lang=js&\"","<template>\n\t<view class=\"u-tabs\" :style=\"{\n\t\t\tzIndex: zIndex,\n\t\t\tbackground: bgColor\n\t\t}\">\n\t\t<scroll-view scroll-x class=\"u-scroll-view\" :scroll-left=\"scrollLeft\" scroll-with-animation :style=\"{ zIndex: zIndex + 1 }\">\n\t\t\t<view class=\"u-tabs-scroll-box\" :class=\"{'u-tabs-scorll-flex': !isScroll}\">\n\t\t\t\t<view class=\"u-tabs-item\" :style=\"[tabItemStyle(index)]\"\n\t\t\t\t v-for=\"(item, index) in getTabs\" :key=\"index\" :class=\"[preId + index]\" @tap=\"emit(index)\">\n\t\t\t\t\t<u-badge :count=\"item[count] || item['count'] || 0\" :offset=\"offset\" size=\"mini\"></u-badge>\n\t\t\t\t\t{{ item[name] || item['name']}}\n\t\t\t\t</view>\n\t\t\t\t<view v-if=\"showBar\" class=\"u-scroll-bar\" :style=\"[tabBarStyle]\"></view>\n\t\t\t</view>\n\t\t</scroll-view>\n\t</view>\n</template>\n\n<script>\n\timport colorGradient from '../../libs/function/colorGradient';\n\tlet color = colorGradient;\n\tconst { windowWidth } = uni.getSystemInfoSync();\n\tconst preId = 'UEl_';\n\n\t/**\n\t * tabsSwiper 全屏选项卡\n\t * @description 该组件内部实现主要依托于uniapp的scroll-view和swiper组件,主要特色是切换过程中,tabsSwiper文字的颜色可以渐变,底部滑块可以 跟随式滑动,活动tab滚动居中等。应用场景可以用于需要左右切换页面,比如商城的订单中心(待收货-待付款-待评价-已退货)等应用场景。\n\t * @tutorial https://www.uviewui.com/components/tabsSwiper.html\n\t * @property {Boolean} is-scroll tabs是否可以左右拖动(默认true)\n\t * @property {Array} list 标签数组,元素为对象,如[{name: '推荐'}]\n\t * @property {String Number} current 指定哪个tab为激活状态(默认0)\n\t * @property {String Number} height 导航栏的高度,单位rpx(默认80)\n\t * @property {String Number} font-size tab文字大小,单位rpx(默认30)\n\t * @property {String Number} swiper-width tabs组件外部swiper的宽度,默认为屏幕宽度,单位rpx(默认750)\n\t * @property {String} active-color 滑块和激活tab文字的颜色(默认#2979ff)\n\t * @property {String} inactive-color tabs文字颜色(默认#303133)\n\t * @property {String Number} bar-width 滑块宽度,单位rpx(默认40)\n\t * @property {String Number} bar-height 滑块高度,单位rpx(默认6)\n\t * @property {Object} bar-style 底部滑块的样式,对象形式\n\t * @property {Object} active-item-style 活动tabs item的样式,对象形式\n\t * @property {Boolean} show-bar 是否显示底部的滑块(默认true)\n\t * @property {String Number} gutter 单个tab标签的左右内边距之和,单位rpx(默认40)\n\t * @property {String} bg-color tabs导航栏的背景颜色(默认#ffffff)\n\t * @property {String} name 组件内部读取的list参数中的属性名,见官网说明(默认name)\n\t * @property {String} count 组件内部读取的list参数中的属性名(badge徽标数),同name属性的使用,见官网说明(默认count)\n\t * @property {Array} offset 设置badge徽标数的位置偏移,格式为 [x, y],也即设置的为top和right的值,单位rpx(默认[5, 20])\n\t * @property {Boolean} bold 激活选项的字体是否加粗(默认true)\n\t * @event {Function} change 点击标签时触发\n\t * @example <u-tabs-swiper ref=\"tabs\" :list=\"list\" :is-scroll=\"false\"></u-tabs-swiper>\n\t */\n\texport default {\n\t\tname: \"u-tabs-swiper\",\n\t\tprops: {\n\t\t\t// 导航菜单是否需要滚动,如只有2或者3个的时候,就不需要滚动了,此时使用flex平分tab的宽度\n\t\t\tisScroll: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tdefault: true\n\t\t\t},\n\t\t\t//需循环的标签列表\n\t\t\tlist: {\n\t\t\t\ttype: Array,\n\t\t\t\tdefault () {\n\t\t\t\t\treturn [];\n\t\t\t\t}\n\t\t\t},\n\t\t\t// 当前活动tab的索引\n\t\t\tcurrent: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 0\n\t\t\t},\n\t\t\t// 导航栏的高度和行高,单位rpx\n\t\t\theight: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 80\n\t\t\t},\n\t\t\t// 字体大小,单位rpx\n\t\t\tfontSize: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 30\n\t\t\t},\n\t\t\t// 过渡动画时长, 单位s\n\t\t\t// duration: {\n\t\t\t// \ttype: [Number, String],\n\t\t\t// \tdefault: 0.5\n\t\t\t// },\n\t\t\tswiperWidth: {\n\t\t\t\t//line3生效, 外部swiper的宽度, 单位rpx\n\t\t\t\ttype: [String, Number],\n\t\t\t\tdefault: 750\n\t\t\t},\n\t\t\t// 选中项的主题颜色\n\t\t\tactiveColor: {\n\t\t\t\ttype: String,\n\t\t\t\tdefault: '#2979ff'\n\t\t\t},\n\t\t\t// 未选中项的颜色\n\t\t\tinactiveColor: {\n\t\t\t\ttype: String,\n\t\t\t\tdefault: '#303133'\n\t\t\t},\n\t\t\t// 菜单底部移动的bar的宽度,单位rpx\n\t\t\tbarWidth: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 40\n\t\t\t},\n\t\t\t// 移动bar的高度\n\t\t\tbarHeight: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 6\n\t\t\t},\n\t\t\t// 单个tab的左或右内边距(各占一半),单位rpx\n\t\t\tgutter: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 40\n\t\t\t},\n\t\t\t// 如果是绝对定位,添加z-index值\n\t\t\tzIndex: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\tdefault: 1\n\t\t\t},\n\t\t\t// 导航栏的背景颜色\n\t\t\tbgColor: {\n\t\t\t\ttype: String,\n\t\t\t\tdefault: '#ffffff'\n\t\t\t},\n\t\t\t//滚动至中心目标类型\n\t\t\tautoCenterMode: {\n\t\t\t\ttype: String,\n\t\t\t\tdefault: 'window'\n\t\t\t},\n\t\t\t// 读取传入的数组对象的属性(tab名称)\n\t\t\tname: {\n\t\t\t\ttype: String,\n\t\t\t\tdefault: 'name'\n\t\t\t},\n\t\t\t// 读取传入的数组对象的属性(徽标数)\n\t\t\tcount: {\n\t\t\t\ttype: String,\n\t\t\t\tdefault: 'count'\n\t\t\t},\n\t\t\t// 徽标数位置偏移\n\t\t\toffset: {\n\t\t\t\ttype: Array,\n\t\t\t\tdefault: () => {\n\t\t\t\t\treturn [5, 20]\n\t\t\t\t}\n\t\t\t},\n\t\t\t// 活动tab字体是否加粗\n\t\t\tbold: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tdefault: true\n\t\t\t},\n\t\t\t// 当前活动tab item的样式\n\t\t\tactiveItemStyle: {\n\t\t\t\ttype: Object,\n\t\t\t\tdefault() {\n\t\t\t\t\treturn {}\n\t\t\t\t}\n\t\t\t},\n\t\t\t// 是否显示底部的滑块\n\t\t\tshowBar: {\n\t\t\t\ttype: Boolean,\n\t\t\t\tdefault: true\n\t\t\t},\n\t\t\t// 底部滑块的自定义样式\n\t\t\tbarStyle: {\n\t\t\t\ttype: Object,\n\t\t\t\tdefault() {\n\t\t\t\t\treturn {}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tscrollLeft: 0, // 滚动scroll-view的左边滚动距离\n\t\t\t\ttabQueryInfo: [], // 存放对tab菜单查询后的节点信息\n\t\t\t\twindowWidth: 0, // 屏幕宽度,单位为px\n\t\t\t\t//scrollBarLeft: 0, // 移动bar需要通过translateX()移动的距离\n\t\t\t\tanimationFinishCurrent: this.current,\n\t\t\t\tcomponentsWidth: 0,\n\t\t\t\tline3AddDx: 0,\n\t\t\t\tline3Dx: 0,\n\t\t\t\tpreId,\n\t\t\t\tsW: 0,\n\t\t\t\ttabsInfo: [],\n\t\t\t\tcolorGradientArr: [],\n\t\t\t\tcolorStep: 100 // 两个颜色之间的渐变等分\n\t\t\t};\n\t\t},\n\t\tcomputed: {\n\t\t\t// 获取当前活跃的current值\n\t\t\tgetCurrent() {\n\t\t\t\tconst current = Number(this.current);\n\t\t\t\t// 判断是否超出边界\n\t\t\t\tif (current > this.getTabs.length - 1) {\n\t\t\t\t\treturn this.getTabs.length - 1;\n\t\t\t\t}\n\t\t\t\tif (current < 0) return 0;\n\t\t\t\treturn current;\n\t\t\t},\n\t\t\tgetTabs() {\n\t\t\t\treturn this.list;\n\t\t\t},\n\t\t\t// 滑块需要移动的距离\n\t\t\tscrollBarLeft() {\n\t\t\t\treturn Number(this.line3Dx) + Number(this.line3AddDx);\n\t\t\t},\n\t\t\t// 滑块的宽度转为px单位\n\t\t\tbarWidthPx() {\n\t\t\t\treturn uni.upx2px(this.barWidth);\n\t\t\t},\n\t\t\t// tab的样式\n\t\t\ttabItemStyle() {\n\t\t\t\treturn (index) => {\n\t\t\t\t\tlet style = {\n\t\t\t\t\t\theight: this.height + 'rpx',\n\t\t\t\t\t\tlineHeight: this.height + 'rpx',\n\t\t\t\t\t\tpadding: `0 ${this.gutter / 2}rpx`,\n\t\t\t\t\t\tcolor: this.tabsInfo.length > 0 ? (this.tabsInfo[index] ? this.tabsInfo[index].color : this.activeColor) : this.inactiveColor,\n\t\t\t\t\t\tfontSize: this.fontSize + 'rpx',\n\t\t\t\t\t\tzIndex: this.zIndex + 2,\n\t\t\t\t\t\tfontWeight: (index == this.getCurrent && this.bold) ? 'bold' : 'normal'\n\t\t\t\t\t};\n\t\t\t\t\tif(index == this.getCurrent) {\n\t\t\t\t\t\t// 给选中的tab item添加外部自定义的样式\n\t\t\t\t\t\tstyle = Object.assign(style, this.activeItemStyle);\n\t\t\t\t\t}\n\t\t\t\t\treturn style;\n\t\t\t\t}\n\t\t\t},\n\t\t\t// 底部滑块的样式\n\t\t\ttabBarStyle() {\n\t\t\t\tlet style = {\n\t\t\t\t\twidth: this.barWidthPx + 'px',\n\t\t\t\t\theight: this.barHeight + 'rpx',\n\t\t\t\t\tborderRadius: '100px',\n\t\t\t\t\tbackgroundColor: this.activeColor,\n\t\t\t\t\tleft: this.scrollBarLeft + 'px'\n\t\t\t\t};\n\t\t\t\treturn Object.assign(style, this.barStyle);\n\t\t\t}\n\t\t},\n\t\twatch: {\n\t\t\tcurrent(n, o) {\n\t\t\t\tthis.change(n);\n\t\t\t\tthis.setFinishCurrent(n);\n\t\t\t},\n\t\t\tlist() {\n\t\t\t\tthis.$nextTick(() => {\n\t\t\t\t\tthis.init();\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t\tmounted() {\n\t\t\tthis.init();\n\t\t},\n\t\tmethods: {\n\t\t\tasync init() {\n\t\t\t\tthis.countPx();\n\t\t\t\tawait this.getTabsInfo();\n\t\t\t\tthis.countLine3Dx();\n\t\t\t\tthis.getQuery(() => {\n\t\t\t\t\tthis.setScrollViewToCenter();\n\t\t\t\t});\n\t\t\t\t// 颜色渐变过程数组\n\t\t\t\tthis.colorGradientArr = color.colorGradient(this.inactiveColor, this.activeColor, this.colorStep);\n\t\t\t},\n\t\t\t// 获取各个tab的节点信息\n\t\t\tgetTabsInfo() {\n\t\t\t\treturn new Promise((resolve, reject) => {\n\t\t\t\t\tlet view = uni.createSelectorQuery().in(this);\n\t\t\t\t\tfor (let i = 0; i < this.list.length; i++) {\n\t\t\t\t\t\tview.select('.' + preId + i).boundingClientRect();\n\t\t\t\t\t}\n\t\t\t\t\tview.exec(res => {\n\t\t\t\t\t\tconst arr = [];\n\t\t\t\t\t\tfor (let i = 0; i < res.length; i++) {\n\t\t\t\t\t\t\t// 给每个tab添加其文字颜色属性\n\t\t\t\t\t\t\tres[i].color = this.inactiveColor;\n\t\t\t\t\t\t\t// 当前tab直接赋予activeColor\n\t\t\t\t\t\t\tif (i == this.getCurrent) res[i].color = this.activeColor;\n\t\t\t\t\t\t\tarr.push(res[i]);\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.tabsInfo = arr;\n\t\t\t\t\t\tresolve();\n\t\t\t\t\t});\n\t\t\t\t})\n\t\t\t},\n\t\t\t// 当swiper滑动结束,计算滑块最终要停留的位置\n\t\t\tcountLine3Dx() {\n\t\t\t\tconst tab = this.tabsInfo[this.animationFinishCurrent];\n\t\t\t\t// 让滑块中心点和当前tab中心重合\n\t\t\t\tif (tab) this.line3Dx = tab.left + tab.width / 2 - this.barWidthPx / 2 - this.tabsInfo[0].left;\n\t\t\t},\n\t\t\tcountPx() {\n\t\t\t\t// swiper宽度由rpx转为px单位,因为dx等,都是px单位\n\t\t\t\tthis.sW = uni.upx2px(Number(this.swiperWidth));\n\t\t\t},\n\t\t\temit(index) {\n\t\t\t\tthis.$emit('change', index);\n\t\t\t},\n\t\t\tchange() {\n\t\t\t\tthis.setScrollViewToCenter();\n\t\t\t},\n\t\t\tgetQuery(cb) {\n\t\t\t\ttry {\n\t\t\t\t\tlet view = uni.createSelectorQuery().in(this).select('.u-tabs');\n\t\t\t\t\tview.fields({\n\t\t\t\t\t\t\tsize: true\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdata => {\n\t\t\t\t\t\t\tif (data) {\n\t\t\t\t\t\t\t\tthis.componentsWidth = data.width;\n\t\t\t\t\t\t\t\tif (cb && typeof cb === 'function') cb(data);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tthis.getQuery(cb);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t).exec();\n\t\t\t\t} catch (e) {\n\t\t\t\t\tthis.componentsWidth = windowWidth;\n\t\t\t\t}\n\t\t\t},\n\t\t\t// 把活动tab移动到屏幕中心点\n\t\t\tsetScrollViewToCenter() {\n\t\t\t\tlet tab;\n\t\t\t\ttab = this.tabsInfo[this.animationFinishCurrent];\n\t\t\t\tif (tab) {\n\t\t\t\t\tlet tabCenter = tab.left + tab.width / 2;\n\t\t\t\t\tlet fatherWidth;\n\t\t\t\t\t// 活动tab移动到中心时,以屏幕还是tab组件为宽度为基准\n\t\t\t\t\tif (this.autoCenterMode === 'window') {\n\t\t\t\t\t\tfatherWidth = windowWidth;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tfatherWidth = this.componentsWidth;\n\t\t\t\t\t}\n\t\t\t\t\tthis.scrollLeft = tabCenter - fatherWidth / 2;\n\t\t\t\t}\n\t\t\t},\n\t\t\tsetDx(dx) {\n\t\t\t\tlet nextTabIndex = dx > 0 ? this.animationFinishCurrent + 1 : this.animationFinishCurrent - 1;\n\t\t\t\t// 判断索引是否超出边界\n\t\t\t\tnextTabIndex = nextTabIndex <= 0 ? 0 : nextTabIndex;\n\t\t\t\tnextTabIndex = nextTabIndex >= this.list.length ? this.list.length - 1 : nextTabIndex;\n\t\t\t\tconst tab = this.tabsInfo[nextTabIndex];\n\t\t\t\t// 当前tab中心点x轴坐标\n\t\t\t\tlet nowTab = this.tabsInfo[this.animationFinishCurrent];\n\t\t\t\tlet nowTabX = nowTab.left + nowTab.width / 2;\n\t\t\t\t// 下一个tab\n\t\t\t\tlet nextTab = this.tabsInfo[nextTabIndex];\n\t\t\t\tlet nextTabX = nextTab.left + nextTab.width / 2;\n\t\t\t\t// 两个tab之间的距离,因为下一个tab可能在当前tab的左边或者右边,取绝对值即可\n\t\t\t\tlet distanceX = Math.abs(nextTabX - nowTabX);\n\t\t\t\tthis.line3AddDx = (dx / this.sW) * distanceX;\n\t\t\t\tthis.setTabColor(this.animationFinishCurrent, nextTabIndex, dx);\n\t\t\t},\n\t\t\t// 设置tab的颜色\n\t\t\tsetTabColor(nowTabIndex, nextTabIndex, dx) {\n\t\t\t\tlet colorIndex = Math.abs(Math.ceil((dx / this.sW) * 100));\n\t\t\t\tlet colorLength = this.colorGradientArr.length;\n\t\t\t\t// 处理超出索引边界的情况\n\t\t\t\tcolorIndex = colorIndex >= colorLength ? colorLength - 1 : colorIndex <= 0 ? 0 : colorIndex;\n\t\t\t\t// 设置下一个tab的颜色\n\t\t\t\tthis.tabsInfo[nextTabIndex].color = this.colorGradientArr[colorIndex];\n\t\t\t\t// 设置当前tab的颜色\n\t\t\t\tthis.tabsInfo[nowTabIndex].color = this.colorGradientArr[colorLength - 1 - colorIndex];\n\t\t\t},\n\t\t\t// swiper结束滑动\n\t\t\tsetFinishCurrent(current) {\n\t\t\t\t// 如果滑动的索引不一致,修改tab颜色变化,因为可能会有直接点击tab的情况\n\t\t\t\tthis.tabsInfo.map((val, index) => {\n\t\t\t\t\tif (current == index) val.color = this.activeColor;\n\t\t\t\t\telse val.color = this.inactiveColor;\n\t\t\t\t\treturn val;\n\t\t\t\t});\n\t\t\t\tthis.line3AddDx = 0;\n\t\t\t\tthis.animationFinishCurrent = current;\n\t\t\t\tthis.countLine3Dx();\n\t\t\t}\n\t\t}\n\t};\n</script>\n\n<style scoped lang=\"scss\">\n\t@import \"../../libs/css/style.components.scss\";\n\n\tview,\n\tscroll-view {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.u-tabs {\n\t\twidth: 100%;\n\t\ttransition-property: background-color, color;\n\t}\n\n\t/* #ifndef APP-NVUE */\n\t::-webkit-scrollbar,\n\t::-webkit-scrollbar,\n\t::-webkit-scrollbar {\n\t\tdisplay: none;\n\t\twidth: 0 !important;\n\t\theight: 0 !important;\n\t\t-webkit-appearance: none;\n\t\tbackground: transparent;\n\t}\n\t/* #endif */\n\n\t/* #ifdef H5 */\n\t// 通过样式穿透,隐藏H5下,scroll-view下的滚动条\n\tscroll-view ::v-deep ::-webkit-scrollbar {\n\t\tdisplay: none;\n\t\twidth: 0 !important;\n\t\theight: 0 !important;\n\t\t-webkit-appearance: none;\n\t\tbackground: transparent;\n\t}\n\n\t/* #endif */\n\n\t.u-scroll-view {\n\t\twidth: 100%;\n\t\twhite-space: nowrap;\n\t\tposition: relative;\n\t}\n\n\t.u-tabs-scroll-box {\n\t\tposition: relative;\n\t}\n\n\t.u-tabs-scorll-flex {\n\t\t@include vue-flex;\n\t\tjustify-content: space-between;\n\t}\n\n\t.u-tabs-scorll-flex .u-tabs-item {\n\t\tflex: 1;\n\t}\n\n\t.u-tabs-item {\n\t\tposition: relative;\n\t\tdisplay: inline-block;\n\t\ttext-align: center;\n\t\ttransition-property: background-color, color, font-weight;\n\t}\n\n\t.content {\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t.boxStyle {\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\ttransition-property: all;\n\t}\n\n\t.boxStyle2 {\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tbottom: 0;\n\t\ttransition-property: all;\n\t\ttransform: translateY(-100%);\n\t}\n\n\t.itemBackgroundBox {\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\ttransition-property: left, background-color;\n\t\t@include vue-flex;\n\t\tflex-direction: row;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.itemBackground {\n\t\theight: 100%;\n\t\twidth: 100%;\n\t\ttransition-property: all;\n\t}\n\n\t.u-scroll-bar {\n\t\tposition: absolute;\n\t\tbottom: 4rpx;\n\t}\n</style>\n","import mod from \"-!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-2!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-3!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-5!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./u-tabs-swiper.vue?vue&type=style&index=0&id=9c8ef540&scoped=true&lang=scss&\"; export default mod; export * from \"-!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-2!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-3!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js??ref--8-oneOf-1-4!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--8-oneOf-1-5!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./u-tabs-swiper.vue?vue&type=style&index=0&id=9c8ef540&scoped=true&lang=scss&\"","// extracted by mini-css-extract-plugin\n    if(module.hot) {\n      // 1657536258129\n      var cssReload = require(\"/Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/hmr/hotModuleReplacement.js\")(module.id, {\"hmr\":true,\"publicPath\":\"../../\",\"locals\":false});\n      module.hot.dispose(cssReload);\n      module.hot.accept(undefined, cssReload);\n    }\n  "],"sourceRoot":""}