You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
16 KiB
1 lines
16 KiB
{"version":3,"sources":["webpack:///C:/Users/liudan/Desktop/git/huajucanyin/components/uni-transition/uni-transition.vue?842e","webpack:///C:/Users/liudan/Desktop/git/huajucanyin/components/uni-transition/uni-transition.vue?f7a7","webpack:///C:/Users/liudan/Desktop/git/huajucanyin/components/uni-transition/uni-transition.vue?9156","webpack:///C:/Users/liudan/Desktop/git/huajucanyin/components/uni-transition/uni-transition.vue?83b7","uni-app:///components/uni-transition/uni-transition.vue","webpack:///C:/Users/liudan/Desktop/git/huajucanyin/components/uni-transition/uni-transition.vue?9a62","webpack:///C:/Users/liudan/Desktop/git/huajucanyin/components/uni-transition/uni-transition.vue?b67a"],"names":["name","props","show","type","default","modeClass","duration","styles","data","isShow","transform","ani","in","active","watch","handler","immediate","computed","stylesObject","transfrom","created","methods","change","detail","open","clearTimeout","setTimeout","close","_animation","getTranfrom","_modeClassArr","mode","modestr","toLine"],"mappings":";;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAuI;AACvI;AACkE;AACL;AACqC;;;AAGlG;AACqK;AACrK,gBAAgB,+KAAU;AAC1B,EAAE,oFAAM;AACR,EAAE,qGAAM;AACR,EAAE,8GAAe;AACjB;AACA;AACA;AACA;AACA;AACA,EAAE,yGAAU;AACZ;AACA;;AAEA;AACe,gF;;;;;;;;;;;;ACvBf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACRA;AAAA;AAAA;AAAA;AAAqnB,CAAgB,koBAAG,EAAC,C;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACUzoB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA,gBAgBA;EACAA;EACAC;IACAC;MACAC;MACAC;IACA;IACAC;MACAF;MACAC;QACA;MACA;IACA;IACAE;MACAH;MACAC;IACA;IACAG;MACAJ;MACAC;QACA;MACA;IACA;EACA;EACAI;IACA;MACAC;MACAC;MACAC;QACAC;QACAC;MACA;IACA;EACA;EACAC;IACAZ;MACAa;QACA;UACA;QACA;UACA;QACA;MACA;MACAC;IACA;EACA;EACAC;IACAC;MACA,6CACA;QACA;MAAA,EACA;MACA;MACA;QACA;QACAC;MACA;MACA;IACA;EACA;EACAC;IACA;IACA;IACA;IACA;IACA;IACA;EAAA,CACA;EACAC;IACAC;MACA;QACAC;MACA;IACA;IACAC;MAAA;MACAC;MACA;MACA;MACA;MACA;QACA;UACA;QACA;UACA;QACA;MACA;MACA;QACAC;UACA;QACA;MACA;IAEA;IACAC;MACAF;MACA;IACA;IACAG;MAAA;MACA;MAmBA;MACA;QACA;UACA;QACA;UACA;QACA;MACA;MACA;QACA;UACA;QACA;QACA;UACAL;QACA;MAEA;IAGA;IACAM;MACA;QACAnB;MACA;MACA;QACA;UACA;YACAH;YACA;UACA;YACAA;YACA;UACA;YACAA;YACA;UACA;YACAA;YACA;UACA;YACAA;YACA;UACA;YACAA;YACA;UACA;YACAA;YACA;QAAA;MAEA;MACA;IACA;IACAuB;MACA;MACA;QACA;QACAC;UACAC;QACA;QACA;MACA;QACA;MACA;IACA;IACA;IACA;IACA;IACA;IACAC;MACA;IACA;EACA;AACA;AAAA,4B;;;;;;;;;;;;ACtNA;AAAA;AAAA;AAAA;AAAo6B,CAAgB,m5BAAG,EAAC,C;;;;;;;;;;;ACAx7B;AACA,OAAO,KAAU,EAAE,kBAKd","file":"components/uni-transition/uni-transition.js","sourcesContent":["import { render, staticRenderFns, recyclableRender, components } from \"./uni-transition.vue?vue&type=template&id=cce16df8&scoped=true&\"\nvar renderjs\nimport script from \"./uni-transition.vue?vue&type=script&lang=js&\"\nexport * from \"./uni-transition.vue?vue&type=script&lang=js&\"\nimport style0 from \"./uni-transition.vue?vue&type=style&index=0&id=cce16df8&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../k/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 \"cce16df8\",\n null,\n false,\n components,\n renderjs\n)\n\ncomponent.options.__file = \"components/uni-transition/uni-transition.vue\"\nexport default component.exports","export * from \"-!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--17-0!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./uni-transition.vue?vue&type=template&id=cce16df8&scoped=true&\"","var components\nvar render = function () {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n}\nvar recyclableRender = false\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns, recyclableRender, components }","import mod from \"-!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--13-1!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./uni-transition.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib/index.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--13-1!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./uni-transition.vue?vue&type=script&lang=js&\"","<template>\r\n\t<view v-if=\"isShow\" ref=\"ani\" class=\"uni-transition\" :class=\"[ani.in]\" :style=\"'transform:' +transform+';'+stylesObject\" @tap=\"change\">\r\n\t\t<slot></slot>\r\n\t</view>\r\n</template>\r\n\r\n<script>\r\n\t// #ifdef APP-NVUE\r\n\tconst animation = uni.requireNativePlugin('animation');\r\n\t// #endif\r\n\t/**\r\n\t * Transition 过渡动画\r\n\t * @description 简单过渡动画组件\r\n\t * @tutorial https://ext.dcloud.net.cn/plugin?id=985\r\n\t * @property {Boolean} show = [false|true] 控制组件显示或隐藏\r\n\t * @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型\r\n\t * @value fade 渐隐渐出过渡\r\n\t * @value slide-top 由上至下过渡\r\n\t * @value slide-right 由右至左过渡\r\n\t * @value slide-bottom 由下至上过渡\r\n\t * @value slide-left 由左至右过渡\r\n\t * @value zoom-in 由小到大过渡\r\n\t * @value zoom-out 由大到小过渡\r\n\t * @property {Number} duration 过渡动画持续时间\r\n\t * @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`\r\n\t */\r\n\texport default {\r\n\t\tname: 'uniTransition',\r\n\t\tprops: {\r\n\t\t\tshow: {\r\n\t\t\t\ttype: Boolean,\r\n\t\t\t\tdefault: false\r\n\t\t\t},\r\n\t\t\tmodeClass: {\r\n\t\t\t\ttype: Array,\r\n\t\t\t\tdefault () {\r\n\t\t\t\t\treturn []\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tduration: {\r\n\t\t\t\ttype: Number,\r\n\t\t\t\tdefault: 300\r\n\t\t\t},\r\n\t\t\tstyles: {\r\n\t\t\t\ttype: Object,\r\n\t\t\t\tdefault () {\r\n\t\t\t\t\treturn {}\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t},\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\tisShow: false,\r\n\t\t\t\ttransform: '',\r\n\t\t\t\tani: {\r\n\t\t\t\t\tin: '',\r\n\t\t\t\t\tactive: ''\r\n\t\t\t\t}\r\n\t\t\t};\r\n\t\t},\r\n\t\twatch: {\r\n\t\t\tshow: {\r\n\t\t\t\thandler(newVal) {\r\n\t\t\t\t\tif (newVal) {\r\n\t\t\t\t\t\tthis.open()\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tthis.close()\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\timmediate: true\r\n\t\t\t}\r\n\t\t},\r\n\t\tcomputed: {\r\n\t\t\tstylesObject() {\r\n\t\t\t\tlet styles = {\r\n\t\t\t\t\t...this.styles,\r\n\t\t\t\t\t'transition-duration': this.duration / 1000 + 's'\r\n\t\t\t\t}\r\n\t\t\t\tlet transfrom = ''\r\n\t\t\t\tfor (let i in styles) {\r\n\t\t\t\t\tlet line = this.toLine(i)\r\n\t\t\t\t\ttransfrom += line + ':' + styles[i] + ';'\r\n\t\t\t\t}\r\n\t\t\t\treturn transfrom\r\n\t\t\t}\r\n\t\t},\r\n\t\tcreated() {\r\n\t\t\t// this.timer = null\r\n\t\t\t// this.nextTick = (time = 50) => new Promise(resolve => {\r\n\t\t\t// \tclearTimeout(this.timer)\r\n\t\t\t// \tthis.timer = setTimeout(resolve, time)\r\n\t\t\t// \treturn this.timer\r\n\t\t\t// });\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tchange() {\r\n\t\t\t\tthis.$emit('click', {\r\n\t\t\t\t\tdetail: this.isShow\r\n\t\t\t\t})\r\n\t\t\t},\r\n\t\t\topen() {\r\n\t\t\t\tclearTimeout(this.timer)\r\n\t\t\t\tthis.isShow = true\r\n\t\t\t\tthis.transform = ''\r\n\t\t\t\tthis.ani.in = ''\r\n\t\t\t\tfor (let i in this.getTranfrom(false)) {\r\n\t\t\t\t\tif (i === 'opacity') {\r\n\t\t\t\t\t\tthis.ani.in = 'fade-in'\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tthis.transform += `${this.getTranfrom(false)[i]} `\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\tthis.$nextTick(() => {\r\n\t\t\t\t\tsetTimeout(() => {\r\n\t\t\t\t\t\tthis._animation(true)\r\n\t\t\t\t\t}, 50)\r\n\t\t\t\t})\r\n\r\n\t\t\t},\r\n\t\t\tclose(type) {\r\n\t\t\t\tclearTimeout(this.timer)\r\n\t\t\t\tthis._animation(false)\r\n\t\t\t},\r\n\t\t\t_animation(type) {\r\n\t\t\t\tlet styles = this.getTranfrom(type)\r\n\t\t\t\t// #ifdef APP-NVUE\r\n\t\t\t\tif (!this.$refs['ani']) return\r\n\t\t\t\tanimation.transition(this.$refs['ani'].ref, {\r\n\t\t\t\t\tstyles,\r\n\t\t\t\t\tduration: this.duration, //ms\r\n\t\t\t\t\ttimingFunction: 'ease',\r\n\t\t\t\t\tneedLayout: false,\r\n\t\t\t\t\tdelay: 0 //ms\r\n\t\t\t\t}, () => {\r\n\t\t\t\t\tif (!type) {\r\n\t\t\t\t\t\tthis.isShow = false\r\n\t\t\t\t\t}\r\n\t\t\t\t\tthis.$emit('change', {\r\n\t\t\t\t\t\tdetail: this.isShow\r\n\t\t\t\t\t})\r\n\t\t\t\t})\r\n\t\t\t\t// #endif\r\n\t\t\t\t// #ifndef APP-NVUE\r\n\t\t\t\tthis.transform = ''\r\n\t\t\t\tfor (let i in styles) {\r\n\t\t\t\t\tif (i === 'opacity') {\r\n\t\t\t\t\t\tthis.ani.in = `fade-${type?'out':'in'}`\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tthis.transform += `${styles[i]} `\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\tthis.timer = setTimeout(() => {\r\n\t\t\t\t\tif (!type) {\r\n\t\t\t\t\t\tthis.isShow = false\r\n\t\t\t\t\t}\r\n\t\t\t\t\tthis.$emit('change', {\r\n\t\t\t\t\t\tdetail: this.isShow\r\n\t\t\t\t\t})\r\n\r\n\t\t\t\t}, this.duration)\r\n\t\t\t\t// #endif\r\n\r\n\t\t\t},\r\n\t\t\tgetTranfrom(type) {\r\n\t\t\t\tlet styles = {\r\n\t\t\t\t\ttransform: ''\r\n\t\t\t\t}\r\n\t\t\t\tthis.modeClass.forEach((mode) => {\r\n\t\t\t\t\tswitch (mode) {\r\n\t\t\t\t\t\tcase 'fade':\r\n\t\t\t\t\t\t\tstyles.opacity = type ? 1 : 0\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t\tcase 'slide-top':\r\n\t\t\t\t\t\t\tstyles.transform += `translateY(${type?'0':'-100%'}) `\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t\tcase 'slide-right':\r\n\t\t\t\t\t\t\tstyles.transform += `translateX(${type?'0':'100%'}) `\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t\tcase 'slide-bottom':\r\n\t\t\t\t\t\t\tstyles.transform += `translateY(${type?'0':'100%'}) `\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t\tcase 'slide-left':\r\n\t\t\t\t\t\t\tstyles.transform += `translateX(${type?'0':'-100%'}) `\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t\tcase 'zoom-in':\r\n\t\t\t\t\t\t\tstyles.transform += `scale(${type?1:0.8}) `\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t\tcase 'zoom-out':\r\n\t\t\t\t\t\t\tstyles.transform += `scale(${type?1:1.2}) `\r\n\t\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t}\r\n\t\t\t\t})\r\n\t\t\t\treturn styles\r\n\t\t\t},\r\n\t\t\t_modeClassArr(type) {\r\n\t\t\t\tlet mode = this.modeClass\r\n\t\t\t\tif (typeof(mode) !== \"string\") {\r\n\t\t\t\t\tlet modestr = ''\r\n\t\t\t\t\tmode.forEach((item) => {\r\n\t\t\t\t\t\tmodestr += (item + '-' + type + ',')\r\n\t\t\t\t\t})\r\n\t\t\t\t\treturn modestr.substr(0, modestr.length - 1)\r\n\t\t\t\t} else {\r\n\t\t\t\t\treturn mode + '-' + type\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\t// getEl(el) {\r\n\t\t\t// \tconsole.log(el || el.ref || null);\r\n\t\t\t// \treturn el || el.ref || null\r\n\t\t\t// },\r\n\t\t\ttoLine(name) {\r\n\t\t\t\treturn name.replace(/([A-Z])/g, \"-$1\").toLowerCase();\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style scoped>\r\n\t.uni-transition {\r\n\t\ttransition-timing-function: ease;\r\n\t\ttransition-duration: 0.3s;\r\n\t\ttransition-property: transform, opacity;\r\n\t}\r\n\r\n\t.fade-in {\r\n\t\topacity: 0;\r\n\t}\r\n\r\n\t.fade-active {\r\n\t\topacity: 1;\r\n\t}\r\n\r\n\t.slide-top-in {\r\n\t\t/* transition-property: transform, opacity; */\r\n\t\ttransform: translateY(-100%);\r\n\t}\r\n\r\n\t.slide-top-active {\r\n\t\ttransform: translateY(0);\r\n\t\t/* opacity: 1; */\r\n\t}\r\n\r\n\t.slide-right-in {\r\n\t\ttransform: translateX(100%);\r\n\t}\r\n\r\n\t.slide-right-active {\r\n\t\ttransform: translateX(0);\r\n\t}\r\n\r\n\t.slide-bottom-in {\r\n\t\ttransform: translateY(100%);\r\n\t}\r\n\r\n\t.slide-bottom-active {\r\n\t\ttransform: translateY(0);\r\n\t}\r\n\r\n\t.slide-left-in {\r\n\t\ttransform: translateX(-100%);\r\n\t}\r\n\r\n\t.slide-left-active {\r\n\t\ttransform: translateX(0);\r\n\t\topacity: 1;\r\n\t}\r\n\r\n\t.zoom-in-in {\r\n\t\ttransform: scale(0.8);\r\n\t}\r\n\r\n\t.zoom-out-active {\r\n\t\ttransform: scale(1);\r\n\t}\r\n\r\n\t.zoom-out-in {\r\n\t\ttransform: scale(1.2);\r\n\t}\r\n</style>","import mod from \"-!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--6-oneOf-1-2!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-3!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./uni-transition.vue?vue&type=style&index=0&id=cce16df8&scoped=true&lang=css&\"; export default mod; export * from \"-!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js??ref--6-oneOf-1-2!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-3!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js??vue-loader-options!../../../../k/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./uni-transition.vue?vue&type=style&index=0&id=cce16df8&scoped=true&lang=css&\"","// extracted by mini-css-extract-plugin\n if(module.hot) {\n // 1699839792297\n var cssReload = require(\"C:/Users/liudan/Desktop/k/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":""} |