cbvirtua 1.0.102 → 1.0.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/better-scroll-dev.zip +0 -0
  2. package/package.json +1 -1
  3. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/.hbuilderx/launch.json +11 -0
  4. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/App.vue +17 -0
  5. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/README.md +13 -0
  6. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/components/xiaolu-tree/code.js +408 -0
  7. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/components/xiaolu-tree/css/icon.css +342 -0
  8. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/components/xiaolu-tree/css/style.scss +119 -0
  9. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/components/xiaolu-tree/search/index.vue +66 -0
  10. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/components/xiaolu-tree/tree.vue +70 -0
  11. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/main.js +11 -0
  12. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/manifest.json +78 -0
  13. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/pages/chooseUser/chooseUser.vue +69 -0
  14. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/pages/chooseUser/data.js +96 -0
  15. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/pages/index/index.vue +122 -0
  16. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/pages.json +25 -0
  17. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/changelog.md +80 -0
  18. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/i18n/en.json +7 -0
  19. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/i18n/index.js +8 -0
  20. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/i18n/zh-Hans.json +7 -0
  21. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/i18n/zh-Hant.json +7 -0
  22. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/keypress.js +45 -0
  23. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/popup.js +26 -0
  24. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/uni-popup.uvue +90 -0
  25. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup/uni-popup.vue +496 -0
  26. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup-dialog/keypress.js +45 -0
  27. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue +313 -0
  28. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup-message/uni-popup-message.vue +143 -0
  29. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/components/uni-popup-share/uni-popup-share.vue +187 -0
  30. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/package.json +87 -0
  31. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-popup/readme.md +17 -0
  32. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/changelog.md +8 -0
  33. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/index.scss +1 -0
  34. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/package.json +82 -0
  35. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/readme.md +4 -0
  36. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/index.scss +7 -0
  37. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_border.scss +3 -0
  38. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_color.scss +66 -0
  39. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_radius.scss +55 -0
  40. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_space.scss +56 -0
  41. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_styles.scss +167 -0
  42. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_text.scss +24 -0
  43. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/setting/_variables.scss +146 -0
  44. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/styles/tools/functions.scss +19 -0
  45. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/theme.scss +31 -0
  46. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-scss/variables.scss +62 -0
  47. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-transition/changelog.md +22 -0
  48. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-transition/components/uni-transition/createAnimation.js +131 -0
  49. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-transition/components/uni-transition/uni-transition.vue +286 -0
  50. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-transition/package.json +84 -0
  51. package/xiaolu-tree-plugin-main/xiaolu-tree-plugin-main/uni_modules/uni-transition/readme.md +11 -0
@@ -0,0 +1,62 @@
1
+ @import './styles/setting/_variables.scss';
2
+ // 间距基础倍数
3
+ $uni-space-root: 2;
4
+ // 边框半径默认值
5
+ $uni-radius-root:5px;
6
+
7
+ // 主色
8
+ $uni-primary: #2979ff;
9
+ $uni-primary-disable:mix(#fff,$uni-primary,50%);
10
+ $uni-primary-light: mix(#fff,$uni-primary,80%);
11
+
12
+ // 辅助色
13
+ // 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。
14
+ $uni-success: #18bc37;
15
+ $uni-success-disable:mix(#fff,$uni-success,50%);
16
+ $uni-success-light: mix(#fff,$uni-success,80%);
17
+
18
+ $uni-warning: #f3a73f;
19
+ $uni-warning-disable:mix(#fff,$uni-warning,50%);
20
+ $uni-warning-light: mix(#fff,$uni-warning,80%);
21
+
22
+ $uni-error: #e43d33;
23
+ $uni-error-disable:mix(#fff,$uni-error,50%);
24
+ $uni-error-light: mix(#fff,$uni-error,80%);
25
+
26
+ $uni-info: #8f939c;
27
+ $uni-info-disable:mix(#fff,$uni-info,50%);
28
+ $uni-info-light: mix(#fff,$uni-info,80%);
29
+
30
+ // 中性色
31
+ // 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。
32
+ $uni-main-color: #3a3a3a; // 主要文字
33
+ $uni-base-color: #6a6a6a; // 常规文字
34
+ $uni-secondary-color: #909399; // 次要文字
35
+ $uni-extra-color: #c7c7c7; // 辅助说明
36
+
37
+ // 边框颜色
38
+ $uni-border-1: #F0F0F0;
39
+ $uni-border-2: #EDEDED;
40
+ $uni-border-3: #DCDCDC;
41
+ $uni-border-4: #B9B9B9;
42
+
43
+ // 常规色
44
+ $uni-black: #000000;
45
+ $uni-white: #ffffff;
46
+ $uni-transparent: rgba($color: #000000, $alpha: 0);
47
+
48
+ // 背景色
49
+ $uni-bg-color: #f7f7f7;
50
+
51
+ /* 水平间距 */
52
+ $uni-spacing-sm: 8px;
53
+ $uni-spacing-base: 15px;
54
+ $uni-spacing-lg: 30px;
55
+
56
+ // 阴影
57
+ $uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5);
58
+ $uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2);
59
+ $uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5);
60
+
61
+ // 蒙版
62
+ $uni-mask: rgba($color: #000000, $alpha: 0.4);
@@ -0,0 +1,22 @@
1
+ ## 1.3.2(2023-05-04)
2
+ - 修复 NVUE 平台报错的问题
3
+ ## 1.3.1(2021-11-23)
4
+ - 修复 init 方法初始化问题
5
+ ## 1.3.0(2021-11-19)
6
+ - 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
7
+ - 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-transition](https://uniapp.dcloud.io/component/uniui/uni-transition)
8
+ ## 1.2.1(2021-09-27)
9
+ - 修复 init 方法不生效的 Bug
10
+ ## 1.2.0(2021-07-30)
11
+ - 组件兼容 vue3,如何创建 vue3 项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
12
+ ## 1.1.1(2021-05-12)
13
+ - 新增 示例地址
14
+ - 修复 示例项目缺少组件的 Bug
15
+ ## 1.1.0(2021-04-22)
16
+ - 新增 通过方法自定义动画
17
+ - 新增 custom-class 非 NVUE 平台支持自定义 class 定制样式
18
+ - 优化 动画触发逻辑,使动画更流畅
19
+ - 优化 支持单独的动画类型
20
+ - 优化 文档示例
21
+ ## 1.0.2(2021-02-05)
22
+ - 调整为 uni_modules 目录规范
@@ -0,0 +1,131 @@
1
+ // const defaultOption = {
2
+ // duration: 300,
3
+ // timingFunction: 'linear',
4
+ // delay: 0,
5
+ // transformOrigin: '50% 50% 0'
6
+ // }
7
+ // #ifdef APP-NVUE
8
+ const nvueAnimation = uni.requireNativePlugin('animation')
9
+ // #endif
10
+ class MPAnimation {
11
+ constructor(options, _this) {
12
+ this.options = options
13
+ // 在iOS10+QQ小程序平台下,传给原生的对象一定是个普通对象而不是Proxy对象,否则会报parameter should be Object instead of ProxyObject的错误
14
+ this.animation = uni.createAnimation({
15
+ ...options
16
+ })
17
+ this.currentStepAnimates = {}
18
+ this.next = 0
19
+ this.$ = _this
20
+
21
+ }
22
+
23
+ _nvuePushAnimates(type, args) {
24
+ let aniObj = this.currentStepAnimates[this.next]
25
+ let styles = {}
26
+ if (!aniObj) {
27
+ styles = {
28
+ styles: {},
29
+ config: {}
30
+ }
31
+ } else {
32
+ styles = aniObj
33
+ }
34
+ if (animateTypes1.includes(type)) {
35
+ if (!styles.styles.transform) {
36
+ styles.styles.transform = ''
37
+ }
38
+ let unit = ''
39
+ if(type === 'rotate'){
40
+ unit = 'deg'
41
+ }
42
+ styles.styles.transform += `${type}(${args+unit}) `
43
+ } else {
44
+ styles.styles[type] = `${args}`
45
+ }
46
+ this.currentStepAnimates[this.next] = styles
47
+ }
48
+ _animateRun(styles = {}, config = {}) {
49
+ let ref = this.$.$refs['ani'].ref
50
+ if (!ref) return
51
+ return new Promise((resolve, reject) => {
52
+ nvueAnimation.transition(ref, {
53
+ styles,
54
+ ...config
55
+ }, res => {
56
+ resolve()
57
+ })
58
+ })
59
+ }
60
+
61
+ _nvueNextAnimate(animates, step = 0, fn) {
62
+ let obj = animates[step]
63
+ if (obj) {
64
+ let {
65
+ styles,
66
+ config
67
+ } = obj
68
+ this._animateRun(styles, config).then(() => {
69
+ step += 1
70
+ this._nvueNextAnimate(animates, step, fn)
71
+ })
72
+ } else {
73
+ this.currentStepAnimates = {}
74
+ typeof fn === 'function' && fn()
75
+ this.isEnd = true
76
+ }
77
+ }
78
+
79
+ step(config = {}) {
80
+ // #ifndef APP-NVUE
81
+ this.animation.step(config)
82
+ // #endif
83
+ // #ifdef APP-NVUE
84
+ this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config)
85
+ this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin
86
+ this.next++
87
+ // #endif
88
+ return this
89
+ }
90
+
91
+ run(fn) {
92
+ // #ifndef APP-NVUE
93
+ this.$.animationData = this.animation.export()
94
+ this.$.timer = setTimeout(() => {
95
+ typeof fn === 'function' && fn()
96
+ }, this.$.durationTime)
97
+ // #endif
98
+ // #ifdef APP-NVUE
99
+ this.isEnd = false
100
+ let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref
101
+ if(!ref) return
102
+ this._nvueNextAnimate(this.currentStepAnimates, 0, fn)
103
+ this.next = 0
104
+ // #endif
105
+ }
106
+ }
107
+
108
+
109
+ const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d',
110
+ 'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY',
111
+ 'translateZ'
112
+ ]
113
+ const animateTypes2 = ['opacity', 'backgroundColor']
114
+ const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom']
115
+ animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => {
116
+ MPAnimation.prototype[type] = function(...args) {
117
+ // #ifndef APP-NVUE
118
+ this.animation[type](...args)
119
+ // #endif
120
+ // #ifdef APP-NVUE
121
+ this._nvuePushAnimates(type, args)
122
+ // #endif
123
+ return this
124
+ }
125
+ })
126
+
127
+ export function createAnimation(option, _this) {
128
+ if(!_this) return
129
+ clearTimeout(_this.timer)
130
+ return new MPAnimation(option, _this)
131
+ }
@@ -0,0 +1,286 @@
1
+ <template>
2
+ <!-- #ifndef APP-NVUE -->
3
+ <view v-show="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
4
+ <!-- #endif -->
5
+ <!-- #ifdef APP-NVUE -->
6
+ <view v-if="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
7
+ <!-- #endif -->
8
+ </template>
9
+
10
+ <script>
11
+ import { createAnimation } from './createAnimation'
12
+
13
+ /**
14
+ * Transition 过渡动画
15
+ * @description 简单过渡动画组件
16
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=985
17
+ * @property {Boolean} show = [false|true] 控制组件显示或隐藏
18
+ * @property {Array|String} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
19
+ * @value fade 渐隐渐出过渡
20
+ * @value slide-top 由上至下过渡
21
+ * @value slide-right 由右至左过渡
22
+ * @value slide-bottom 由下至上过渡
23
+ * @value slide-left 由左至右过渡
24
+ * @value zoom-in 由小到大过渡
25
+ * @value zoom-out 由大到小过渡
26
+ * @property {Number} duration 过渡动画持续时间
27
+ * @property {Object} styles 组件样式,同 css 样式,注意带’-‘连接符的属性需要使用小驼峰写法如:`backgroundColor:red`
28
+ */
29
+ export default {
30
+ name: 'uniTransition',
31
+ emits:['click','change'],
32
+ props: {
33
+ show: {
34
+ type: Boolean,
35
+ default: false
36
+ },
37
+ modeClass: {
38
+ type: [Array, String],
39
+ default() {
40
+ return 'fade'
41
+ }
42
+ },
43
+ duration: {
44
+ type: Number,
45
+ default: 300
46
+ },
47
+ styles: {
48
+ type: Object,
49
+ default() {
50
+ return {}
51
+ }
52
+ },
53
+ customClass:{
54
+ type: String,
55
+ default: ''
56
+ },
57
+ onceRender:{
58
+ type:Boolean,
59
+ default:false
60
+ },
61
+ },
62
+ data() {
63
+ return {
64
+ isShow: false,
65
+ transform: '',
66
+ opacity: 1,
67
+ animationData: {},
68
+ durationTime: 300,
69
+ config: {}
70
+ }
71
+ },
72
+ watch: {
73
+ show: {
74
+ handler(newVal) {
75
+ if (newVal) {
76
+ this.open()
77
+ } else {
78
+ // 避免上来就执行 close,导致动画错乱
79
+ if (this.isShow) {
80
+ this.close()
81
+ }
82
+ }
83
+ },
84
+ immediate: true
85
+ }
86
+ },
87
+ computed: {
88
+ // 生成样式数据
89
+ stylesObject() {
90
+ let styles = {
91
+ ...this.styles,
92
+ 'transition-duration': this.duration / 1000 + 's'
93
+ }
94
+ let transform = ''
95
+ for (let i in styles) {
96
+ let line = this.toLine(i)
97
+ transform += line + ':' + styles[i] + ';'
98
+ }
99
+ return transform
100
+ },
101
+ // 初始化动画条件
102
+ transformStyles() {
103
+ return 'transform:' + this.transform + ';' + 'opacity:' + this.opacity + ';' + this.stylesObject
104
+ }
105
+ },
106
+ created() {
107
+ // 动画默认配置
108
+ this.config = {
109
+ duration: this.duration,
110
+ timingFunction: 'ease',
111
+ transformOrigin: '50% 50%',
112
+ delay: 0
113
+ }
114
+ this.durationTime = this.duration
115
+ },
116
+ methods: {
117
+ /**
118
+ * ref 触发 初始化动画
119
+ */
120
+ init(obj = {}) {
121
+ if (obj.duration) {
122
+ this.durationTime = obj.duration
123
+ }
124
+ this.animation = createAnimation(Object.assign(this.config, obj),this)
125
+ },
126
+ /**
127
+ * 点击组件触发回调
128
+ */
129
+ onClick() {
130
+ this.$emit('click', {
131
+ detail: this.isShow
132
+ })
133
+ },
134
+ /**
135
+ * ref 触发 动画分组
136
+ * @param {Object} obj
137
+ */
138
+ step(obj, config = {}) {
139
+ if (!this.animation) return
140
+ for (let i in obj) {
141
+ try {
142
+ if(typeof obj[i] === 'object'){
143
+ this.animation[i](...obj[i])
144
+ }else{
145
+ this.animation[i](obj[i])
146
+ }
147
+ } catch (e) {
148
+ console.error(`方法 ${i} 不存在`)
149
+ }
150
+ }
151
+ this.animation.step(config)
152
+ return this
153
+ },
154
+ /**
155
+ * ref 触发 执行动画
156
+ */
157
+ run(fn) {
158
+ if (!this.animation) return
159
+ this.animation.run(fn)
160
+ },
161
+ // 开始过度动画
162
+ open() {
163
+ clearTimeout(this.timer)
164
+ this.transform = ''
165
+ this.isShow = true
166
+ let { opacity, transform } = this.styleInit(false)
167
+ if (typeof opacity !== 'undefined') {
168
+ this.opacity = opacity
169
+ }
170
+ this.transform = transform
171
+ // 确保动态样式已经生效后,执行动画,如果不加 nextTick ,会导致 wx 动画执行异常
172
+ this.$nextTick(() => {
173
+ // TODO 定时器保证动画完全执行,目前有些问题,后面会取消定时器
174
+ this.timer = setTimeout(() => {
175
+ this.animation = createAnimation(this.config, this)
176
+ this.tranfromInit(false).step()
177
+ this.animation.run()
178
+ this.$emit('change', {
179
+ detail: this.isShow
180
+ })
181
+ }, 20)
182
+ })
183
+ },
184
+ // 关闭过度动画
185
+ close(type) {
186
+ if (!this.animation) return
187
+ this.tranfromInit(true)
188
+ .step()
189
+ .run(() => {
190
+ this.isShow = false
191
+ this.animationData = null
192
+ this.animation = null
193
+ let { opacity, transform } = this.styleInit(false)
194
+ this.opacity = opacity || 1
195
+ this.transform = transform
196
+ this.$emit('change', {
197
+ detail: this.isShow
198
+ })
199
+ })
200
+ },
201
+ // 处理动画开始前的默认样式
202
+ styleInit(type) {
203
+ let styles = {
204
+ transform: ''
205
+ }
206
+ let buildStyle = (type, mode) => {
207
+ if (mode === 'fade') {
208
+ styles.opacity = this.animationType(type)[mode]
209
+ } else {
210
+ styles.transform += this.animationType(type)[mode] + ' '
211
+ }
212
+ }
213
+ if (typeof this.modeClass === 'string') {
214
+ buildStyle(type, this.modeClass)
215
+ } else {
216
+ this.modeClass.forEach(mode => {
217
+ buildStyle(type, mode)
218
+ })
219
+ }
220
+ return styles
221
+ },
222
+ // 处理内置组合动画
223
+ tranfromInit(type) {
224
+ let buildTranfrom = (type, mode) => {
225
+ let aniNum = null
226
+ if (mode === 'fade') {
227
+ aniNum = type ? 0 : 1
228
+ } else {
229
+ aniNum = type ? '-100%' : '0'
230
+ if (mode === 'zoom-in') {
231
+ aniNum = type ? 0.8 : 1
232
+ }
233
+ if (mode === 'zoom-out') {
234
+ aniNum = type ? 1.2 : 1
235
+ }
236
+ if (mode === 'slide-right') {
237
+ aniNum = type ? '100%' : '0'
238
+ }
239
+ if (mode === 'slide-bottom') {
240
+ aniNum = type ? '100%' : '0'
241
+ }
242
+ }
243
+ this.animation[this.animationMode()[mode]](aniNum)
244
+ }
245
+ if (typeof this.modeClass === 'string') {
246
+ buildTranfrom(type, this.modeClass)
247
+ } else {
248
+ this.modeClass.forEach(mode => {
249
+ buildTranfrom(type, mode)
250
+ })
251
+ }
252
+
253
+ return this.animation
254
+ },
255
+ animationType(type) {
256
+ return {
257
+ fade: type ? 1 : 0,
258
+ 'slide-top': `translateY(${type ? '0' : '-100%'})`,
259
+ 'slide-right': `translateX(${type ? '0' : '100%'})`,
260
+ 'slide-bottom': `translateY(${type ? '0' : '100%'})`,
261
+ 'slide-left': `translateX(${type ? '0' : '-100%'})`,
262
+ 'zoom-in': `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
263
+ 'zoom-out': `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
264
+ }
265
+ },
266
+ // 内置动画类型与实际动画对应字典
267
+ animationMode() {
268
+ return {
269
+ fade: 'opacity',
270
+ 'slide-top': 'translateY',
271
+ 'slide-right': 'translateX',
272
+ 'slide-bottom': 'translateY',
273
+ 'slide-left': 'translateX',
274
+ 'zoom-in': 'scale',
275
+ 'zoom-out': 'scale'
276
+ }
277
+ },
278
+ // 驼峰转中横线
279
+ toLine(name) {
280
+ return name.replace(/([A-Z])/g, '-$1').toLowerCase()
281
+ }
282
+ }
283
+ }
284
+ </script>
285
+
286
+ <style></style>
@@ -0,0 +1,84 @@
1
+ {
2
+ "id": "uni-transition",
3
+ "displayName": "uni-transition 过渡动画",
4
+ "version": "1.3.2",
5
+ "description": "元素的简单过渡动画",
6
+ "keywords": [
7
+ "uni-ui",
8
+ "uniui",
9
+ "动画",
10
+ "过渡",
11
+ "过渡动画"
12
+ ],
13
+ "repository": "https://github.com/dcloudio/uni-ui",
14
+ "engines": {
15
+ "HBuilderX": ""
16
+ },
17
+ "directories": {
18
+ "example": "../../temps/example_temps"
19
+ },
20
+ "dcloudext": {
21
+ "sale": {
22
+ "regular": {
23
+ "price": "0.00"
24
+ },
25
+ "sourcecode": {
26
+ "price": "0.00"
27
+ }
28
+ },
29
+ "contact": {
30
+ "qq": ""
31
+ },
32
+ "declaration": {
33
+ "ads": "无",
34
+ "data": "无",
35
+ "permissions": "无"
36
+ },
37
+ "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
38
+ "type": "component-vue"
39
+ },
40
+ "uni_modules": {
41
+ "dependencies": ["uni-scss"],
42
+ "encrypt": [],
43
+ "platforms": {
44
+ "cloud": {
45
+ "tcb": "y",
46
+ "aliyun": "y"
47
+ },
48
+ "client": {
49
+ "App": {
50
+ "app-vue": "y",
51
+ "app-nvue": "y"
52
+ },
53
+ "H5-mobile": {
54
+ "Safari": "y",
55
+ "Android Browser": "y",
56
+ "微信浏览器(Android)": "y",
57
+ "QQ浏览器(Android)": "y"
58
+ },
59
+ "H5-pc": {
60
+ "Chrome": "y",
61
+ "IE": "y",
62
+ "Edge": "y",
63
+ "Firefox": "y",
64
+ "Safari": "y"
65
+ },
66
+ "小程序": {
67
+ "微信": "y",
68
+ "阿里": "y",
69
+ "百度": "y",
70
+ "字节跳动": "y",
71
+ "QQ": "y"
72
+ },
73
+ "快应用": {
74
+ "华为": "u",
75
+ "联盟": "u"
76
+ },
77
+ "Vue": {
78
+ "vue2": "y",
79
+ "vue3": "y"
80
+ }
81
+ }
82
+ }
83
+ }
84
+ }
@@ -0,0 +1,11 @@
1
+
2
+
3
+ ## Transition 过渡动画
4
+ > **组件名:uni-transition**
5
+ > 代码块: `uTransition`
6
+
7
+
8
+ 元素过渡动画
9
+
10
+ ### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-transition)
11
+ #### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839