uview-pro 0.0.14 → 0.0.16

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 (236) hide show
  1. package/changelog.md +232 -223
  2. package/components/u-action-sheet/types.ts +35 -35
  3. package/components/u-action-sheet/u-action-sheet.vue +160 -160
  4. package/components/u-alert-tips/types.ts +39 -39
  5. package/components/u-alert-tips/u-alert-tips.vue +212 -212
  6. package/components/u-avatar/types.ts +34 -34
  7. package/components/u-avatar/u-avatar.vue +193 -193
  8. package/components/u-avatar-cropper/types.ts +23 -23
  9. package/components/u-avatar-cropper/u-avatar-cropper.vue +286 -286
  10. package/components/u-avatar-cropper/weCropper.d.ts +62 -62
  11. package/components/u-avatar-cropper/weCropper.js +1253 -1253
  12. package/components/u-avatar-cropper/weCropper.ts +1255 -1255
  13. package/components/u-back-top/types.ts +39 -39
  14. package/components/u-back-top/u-back-top.vue +125 -125
  15. package/components/u-badge/types.ts +36 -36
  16. package/components/u-badge/u-badge.vue +165 -165
  17. package/components/u-button/types.ts +66 -66
  18. package/components/u-button/u-button.vue +554 -554
  19. package/components/u-calendar/types.ts +63 -63
  20. package/components/u-calendar/u-calendar.vue +592 -592
  21. package/components/u-car-keyboard/types.ts +12 -12
  22. package/components/u-car-keyboard/u-car-keyboard.vue +234 -234
  23. package/components/u-card/types.ts +59 -59
  24. package/components/u-card/u-card.vue +194 -194
  25. package/components/u-cell-group/types.ts +17 -17
  26. package/components/u-cell-group/u-cell-group.vue +50 -50
  27. package/components/u-cell-item/types.ts +54 -54
  28. package/components/u-cell-item/u-cell-item.vue +202 -202
  29. package/components/u-checkbox/types.ts +31 -31
  30. package/components/u-checkbox/u-checkbox.vue +265 -265
  31. package/components/u-checkbox-group/types.ts +32 -32
  32. package/components/u-checkbox-group/u-checkbox-group.vue +79 -79
  33. package/components/u-circle-progress/types.ts +52 -52
  34. package/components/u-circle-progress/u-circle-progress.vue +189 -189
  35. package/components/u-city-select/types.ts +20 -20
  36. package/components/u-city-select/u-city-select.vue +236 -236
  37. package/components/u-col/types.ts +30 -30
  38. package/components/u-col/u-col.vue +123 -123
  39. package/components/u-collapse/types.ts +31 -31
  40. package/components/u-collapse/u-collapse.vue +68 -68
  41. package/components/u-collapse-item/types.ts +25 -25
  42. package/components/u-collapse-item/u-collapse-item.vue +176 -176
  43. package/components/u-column-notice/types.ts +48 -48
  44. package/components/u-column-notice/u-column-notice.vue +176 -176
  45. package/components/u-count-down/types.ts +42 -42
  46. package/components/u-count-down/u-count-down.vue +258 -258
  47. package/components/u-count-to/types.ts +32 -32
  48. package/components/u-count-to/u-count-to.vue +241 -241
  49. package/components/u-divider/types.ts +31 -31
  50. package/components/u-divider/u-divider.vue +121 -121
  51. package/components/u-dropdown/types.ts +32 -32
  52. package/components/u-dropdown/u-dropdown.vue +289 -289
  53. package/components/u-dropdown-item/types.ts +27 -27
  54. package/components/u-dropdown-item/u-dropdown-item.vue +123 -123
  55. package/components/u-empty/types.ts +36 -36
  56. package/components/u-empty/u-empty.vue +88 -88
  57. package/components/u-field/types.ts +69 -69
  58. package/components/u-field/u-field.vue +354 -354
  59. package/components/u-form/types.ts +6 -4
  60. package/components/u-form/u-form.vue +19 -5
  61. package/components/u-form-item/types.ts +2 -2
  62. package/components/u-form-item/u-form-item.vue +7 -6
  63. package/components/u-full-screen/types.ts +14 -14
  64. package/components/u-full-screen/u-full-screen.vue +82 -82
  65. package/components/u-gap/types.ts +18 -18
  66. package/components/u-gap/u-gap.vue +40 -40
  67. package/components/u-grid/types.ts +19 -19
  68. package/components/u-grid/u-grid.vue +93 -93
  69. package/components/u-grid-item/types.ts +16 -16
  70. package/components/u-grid-item/u-grid-item.vue +130 -130
  71. package/components/u-icon/types.ts +62 -62
  72. package/components/u-icon/u-icon.vue +274 -274
  73. package/components/u-image/types.ts +51 -49
  74. package/components/u-image/u-image.vue +222 -218
  75. package/components/u-index-anchor/types.ts +16 -16
  76. package/components/u-index-anchor/u-index-anchor.vue +86 -86
  77. package/components/u-index-list/types.ts +43 -43
  78. package/components/u-index-list/u-index-list.vue +355 -355
  79. package/components/u-input/types.ts +140 -140
  80. package/components/u-input/u-input.vue +255 -255
  81. package/components/u-keyboard/types.ts +40 -40
  82. package/components/u-keyboard/u-keyboard.vue +158 -158
  83. package/components/u-lazy-load/types.ts +37 -37
  84. package/components/u-lazy-load/u-lazy-load.vue +233 -233
  85. package/components/u-line/types.ts +44 -44
  86. package/components/u-line/u-line.vue +59 -59
  87. package/components/u-line-progress/types.ts +58 -58
  88. package/components/u-line-progress/u-line-progress.vue +109 -109
  89. package/components/u-link/types.ts +43 -43
  90. package/components/u-link/u-link.vue +75 -75
  91. package/components/u-loading/types.ts +35 -35
  92. package/components/u-loading/u-loading.vue +90 -90
  93. package/components/u-loading-popup/types.ts +19 -0
  94. package/components/u-loading-popup/u-loading-popup.vue +208 -0
  95. package/components/u-loadmore/types.ts +79 -79
  96. package/components/u-loadmore/u-loadmore.vue +140 -140
  97. package/components/u-mask/types.ts +43 -43
  98. package/components/u-mask/u-mask.vue +106 -106
  99. package/components/u-message-input/types.ts +74 -74
  100. package/components/u-message-input/u-message-input.vue +255 -255
  101. package/components/u-modal/types.ts +118 -118
  102. package/components/u-modal/u-modal.vue +200 -200
  103. package/components/u-navbar/types.ts +103 -103
  104. package/components/u-navbar/u-navbar.vue +226 -226
  105. package/components/u-no-network/image.ts +2 -2
  106. package/components/u-no-network/types.ts +28 -28
  107. package/components/u-no-network/u-no-network.vue +290 -290
  108. package/components/u-notice-bar/types.ts +111 -111
  109. package/components/u-notice-bar/u-notice-bar.vue +174 -174
  110. package/components/u-number-box/types.ts +42 -42
  111. package/components/u-number-box/u-number-box.vue +312 -312
  112. package/components/u-number-keyboard/types.ts +26 -26
  113. package/components/u-number-keyboard/u-number-keyboard.vue +166 -166
  114. package/components/u-picker/types.ts +111 -111
  115. package/components/u-picker/u-picker.vue +637 -637
  116. package/components/u-popup/types.ts +59 -59
  117. package/components/u-popup/u-popup.vue +359 -359
  118. package/components/u-radio/types.ts +25 -25
  119. package/components/u-radio/u-radio.vue +258 -258
  120. package/components/u-radio-group/types.ts +29 -29
  121. package/components/u-radio-group/u-radio-group.vue +98 -98
  122. package/components/u-rate/types.ts +40 -40
  123. package/components/u-rate/u-rate.vue +234 -234
  124. package/components/u-read-more/types.ts +35 -35
  125. package/components/u-read-more/u-read-more.vue +150 -150
  126. package/components/u-row/types.ts +20 -20
  127. package/components/u-row/u-row.vue +87 -87
  128. package/components/u-row-notice/types.ts +39 -39
  129. package/components/u-row-notice/u-row-notice.vue +213 -213
  130. package/components/u-search/types.ts +53 -53
  131. package/components/u-search/u-search.vue +256 -256
  132. package/components/u-section/types.ts +32 -32
  133. package/components/u-section/u-section.vue +125 -125
  134. package/components/u-select/types.ts +43 -43
  135. package/components/u-select/u-select.vue +361 -345
  136. package/components/u-skeleton/types.ts +20 -20
  137. package/components/u-skeleton/u-skeleton.vue +205 -205
  138. package/components/u-slider/types.ts +32 -32
  139. package/components/u-slider/u-slider.vue +238 -238
  140. package/components/u-steps/types.ts +28 -28
  141. package/components/u-steps/u-steps.vue +160 -160
  142. package/components/u-sticky/types.ts +22 -22
  143. package/components/u-sticky/u-sticky.vue +159 -159
  144. package/components/u-subsection/types.ts +36 -36
  145. package/components/u-subsection/u-subsection.vue +328 -328
  146. package/components/u-swipe-action/types.ts +50 -50
  147. package/components/u-swipe-action/u-swipe-action.vue +253 -253
  148. package/components/u-swiper/types.ts +47 -47
  149. package/components/u-swiper/u-swiper.vue +266 -266
  150. package/components/u-switch/types.ts +28 -28
  151. package/components/u-switch/u-switch.vue +128 -128
  152. package/components/u-tabbar/types.ts +36 -36
  153. package/components/u-tabbar/u-tabbar.vue +280 -280
  154. package/components/u-table/types.ts +25 -25
  155. package/components/u-table/u-table.vue +55 -55
  156. package/components/u-tabs/types.ts +51 -51
  157. package/components/u-tabs/u-tabs.vue +284 -284
  158. package/components/u-tabs-swiper/types.ts +53 -53
  159. package/components/u-tabs-swiper/u-tabs-swiper.vue +379 -379
  160. package/components/u-tag/types.ts +37 -37
  161. package/components/u-tag/u-tag.vue +244 -244
  162. package/components/u-td/types.ts +12 -12
  163. package/components/u-td/u-td.vue +69 -69
  164. package/components/u-th/types.ts +12 -12
  165. package/components/u-th/u-th.vue +63 -63
  166. package/components/u-time-line/u-time-line.vue +39 -39
  167. package/components/u-time-line-item/types.ts +14 -14
  168. package/components/u-time-line-item/u-time-line-item.vue +78 -78
  169. package/components/u-toast/types.ts +36 -36
  170. package/components/u-toast/u-toast.vue +233 -233
  171. package/components/u-top-tips/types.ts +14 -14
  172. package/components/u-top-tips/u-top-tips.vue +113 -113
  173. package/components/u-tr/types.ts +8 -8
  174. package/components/u-tr/u-tr.vue +24 -24
  175. package/components/u-upload/types.ts +71 -71
  176. package/components/u-upload/u-upload.vue +545 -545
  177. package/components/u-verification-code/types.ts +22 -22
  178. package/components/u-verification-code/u-verification-code.vue +164 -164
  179. package/components/u-waterfall/types.ts +16 -16
  180. package/components/u-waterfall/u-waterfall.vue +170 -170
  181. package/iconfont.css +910 -910
  182. package/index.scss +22 -22
  183. package/index.ts +202 -202
  184. package/libs/config/config.ts +26 -26
  185. package/libs/config/zIndex.ts +37 -37
  186. package/libs/css/color.scss +155 -155
  187. package/libs/css/common.scss +175 -175
  188. package/libs/css/style.components.scss +6 -6
  189. package/libs/css/style.h5.scss +8 -8
  190. package/libs/css/style.mp.scss +72 -72
  191. package/libs/css/style.nvue.scss +2 -2
  192. package/libs/css/style.vue.scss +175 -175
  193. package/libs/function/$parent.ts +22 -22
  194. package/libs/function/addUnit.ts +13 -13
  195. package/libs/function/color.ts +36 -36
  196. package/libs/function/colorGradient.ts +125 -125
  197. package/libs/function/debounce.ts +28 -28
  198. package/libs/function/deepClone.ts +39 -39
  199. package/libs/function/deepMerge.ts +34 -34
  200. package/libs/function/getParent.ts +58 -58
  201. package/libs/function/getRect.ts +26 -26
  202. package/libs/function/guid.ts +42 -42
  203. package/libs/function/md5.ts +398 -398
  204. package/libs/function/parent.ts +21 -21
  205. package/libs/function/queryParams.ts +60 -60
  206. package/libs/function/random.ts +16 -16
  207. package/libs/function/randomArray.ts +11 -11
  208. package/libs/function/route.ts +118 -118
  209. package/libs/function/sys.ts +15 -15
  210. package/libs/function/test.ts +229 -229
  211. package/libs/function/throttle.ts +31 -31
  212. package/libs/function/timeFormat.ts +54 -54
  213. package/libs/function/timeFrom.ts +48 -48
  214. package/libs/function/toast.ts +14 -14
  215. package/libs/function/trim.ts +21 -21
  216. package/libs/function/type2icon.ts +36 -36
  217. package/libs/hooks/useEmitter.ts +77 -77
  218. package/libs/hooks/useParent.ts +29 -29
  219. package/libs/request/auto-http.ts +76 -76
  220. package/libs/request/index.ts +237 -237
  221. package/libs/request/uni-http.md +156 -156
  222. package/libs/request/uni-http.ts +434 -434
  223. package/libs/store/index.ts +88 -88
  224. package/libs/util/async-validator.d.ts +62 -62
  225. package/libs/util/async-validator.js +1356 -1356
  226. package/libs/util/emitter.ts +112 -112
  227. package/libs/util/mitt.ts +118 -118
  228. package/libs/util/parent.ts +20 -20
  229. package/package.json +107 -107
  230. package/readme.md +231 -237
  231. package/theme.scss +38 -38
  232. package/types/components.d.ts +95 -94
  233. package/types/global.d.ts +221 -208
  234. package/types/ignore-errors.d.ts +30 -30
  235. package/types/index.d.ts +90 -90
  236. package/types/uni-app.d.ts +63 -63
@@ -1,48 +1,48 @@
1
- import timeFormat from './timeFormat';
2
-
3
- /**
4
- * 时间戳转为多久之前
5
- * @param dateTime 时间戳、Date对象或null,默认当前时间
6
- * @param format 时间格式字符串或false,超出范围时返回指定格式,否则返回多久以前
7
- * @returns 格式化后的时间字符串
8
- */
9
- function timeFrom(dateTime: number | string | Date | null = null, format: string | false = 'yyyy-mm-dd'): string {
10
- // 如果为null,则格式化当前时间
11
- if (!dateTime) dateTime = Number(new Date());
12
- // 如果dateTime长度为10或者13,则为秒和毫秒的时间戳,如果超过13位,则为其他的时间格式
13
- if (typeof dateTime === 'number' || typeof dateTime === 'string') {
14
- if (dateTime.toString().length == 10) dateTime = Number(dateTime) * 1000;
15
- }
16
- const timestamp = +new Date(Number(dateTime));
17
- const timer = (Number(new Date()) - timestamp) / 1000;
18
- // 如果小于5分钟,则返回"刚刚",其他以此类推
19
- let tips = '';
20
- switch (true) {
21
- case timer < 300:
22
- tips = '刚刚';
23
- break;
24
- case timer >= 300 && timer < 3600:
25
- tips = parseInt(String(timer / 60)) + '分钟前';
26
- break;
27
- case timer >= 3600 && timer < 86400:
28
- tips = parseInt(String(timer / 3600)) + '小时前';
29
- break;
30
- case timer >= 86400 && timer < 2592000:
31
- tips = parseInt(String(timer / 86400)) + '天前';
32
- break;
33
- default:
34
- // 如果format为false,则无论什么时间戳,都显示xx之前
35
- if (format === false) {
36
- if (timer >= 2592000 && timer < 365 * 86400) {
37
- tips = parseInt(String(timer / (86400 * 30))) + '个月前';
38
- } else {
39
- tips = parseInt(String(timer / (86400 * 365))) + '年前';
40
- }
41
- } else {
42
- tips = timeFormat(timestamp, format as string);
43
- }
44
- }
45
- return tips;
46
- }
47
-
48
- export default timeFrom;
1
+ import timeFormat from './timeFormat';
2
+
3
+ /**
4
+ * 时间戳转为多久之前
5
+ * @param dateTime 时间戳、Date对象或null,默认当前时间
6
+ * @param format 时间格式字符串或false,超出范围时返回指定格式,否则返回多久以前
7
+ * @returns 格式化后的时间字符串
8
+ */
9
+ function timeFrom(dateTime: number | string | Date | null = null, format: string | false = 'yyyy-mm-dd'): string {
10
+ // 如果为null,则格式化当前时间
11
+ if (!dateTime) dateTime = Number(new Date());
12
+ // 如果dateTime长度为10或者13,则为秒和毫秒的时间戳,如果超过13位,则为其他的时间格式
13
+ if (typeof dateTime === 'number' || typeof dateTime === 'string') {
14
+ if (dateTime.toString().length == 10) dateTime = Number(dateTime) * 1000;
15
+ }
16
+ const timestamp = +new Date(Number(dateTime));
17
+ const timer = (Number(new Date()) - timestamp) / 1000;
18
+ // 如果小于5分钟,则返回"刚刚",其他以此类推
19
+ let tips = '';
20
+ switch (true) {
21
+ case timer < 300:
22
+ tips = '刚刚';
23
+ break;
24
+ case timer >= 300 && timer < 3600:
25
+ tips = parseInt(String(timer / 60)) + '分钟前';
26
+ break;
27
+ case timer >= 3600 && timer < 86400:
28
+ tips = parseInt(String(timer / 3600)) + '小时前';
29
+ break;
30
+ case timer >= 86400 && timer < 2592000:
31
+ tips = parseInt(String(timer / 86400)) + '天前';
32
+ break;
33
+ default:
34
+ // 如果format为false,则无论什么时间戳,都显示xx之前
35
+ if (format === false) {
36
+ if (timer >= 2592000 && timer < 365 * 86400) {
37
+ tips = parseInt(String(timer / (86400 * 30))) + '个月前';
38
+ } else {
39
+ tips = parseInt(String(timer / (86400 * 365))) + '年前';
40
+ }
41
+ } else {
42
+ tips = timeFormat(timestamp, format as string);
43
+ }
44
+ }
45
+ return tips;
46
+ }
47
+
48
+ export default timeFrom;
@@ -1,14 +1,14 @@
1
- /**
2
- * 显示无图标的 Toast 提示
3
- * @param title 提示文本
4
- * @param duration 显示时长(毫秒),默认1500
5
- */
6
- function toast(title: string, duration: number = 1500): void {
7
- uni.showToast({
8
- title: title,
9
- icon: 'none',
10
- duration: duration
11
- });
12
- }
13
-
14
- export default toast;
1
+ /**
2
+ * 显示无图标的 Toast 提示
3
+ * @param title 提示文本
4
+ * @param duration 显示时长(毫秒),默认1500
5
+ */
6
+ function toast(title: string, duration: number = 1500): void {
7
+ uni.showToast({
8
+ title: title,
9
+ icon: 'none',
10
+ duration: duration
11
+ });
12
+ }
13
+
14
+ export default toast;
@@ -1,21 +1,21 @@
1
- /**
2
- * 去除字符串空格
3
- * @param str 输入字符串
4
- * @param pos 去除位置,'both' | 'left' | 'right' | 'all',默认'both'
5
- * @returns 去除空格后的字符串
6
- */
7
- function trim(str: string, pos: 'both' | 'left' | 'right' | 'all' = 'both'): string {
8
- if (pos === 'both') {
9
- return str.replace(/^\s+|\s+$/g, '');
10
- } else if (pos === 'left') {
11
- return str.replace(/^\s*/, '');
12
- } else if (pos === 'right') {
13
- return str.replace(/(\s*$)/g, '');
14
- } else if (pos === 'all') {
15
- return str.replace(/\s+/g, '');
16
- } else {
17
- return str;
18
- }
19
- }
20
-
21
- export default trim;
1
+ /**
2
+ * 去除字符串空格
3
+ * @param str 输入字符串
4
+ * @param pos 去除位置,'both' | 'left' | 'right' | 'all',默认'both'
5
+ * @returns 去除空格后的字符串
6
+ */
7
+ function trim(str: string, pos: 'both' | 'left' | 'right' | 'all' = 'both'): string {
8
+ if (pos === 'both') {
9
+ return str.replace(/^\s+|\s+$/g, '');
10
+ } else if (pos === 'left') {
11
+ return str.replace(/^\s*/, '');
12
+ } else if (pos === 'right') {
13
+ return str.replace(/(\s*$)/g, '');
14
+ } else if (pos === 'all') {
15
+ return str.replace(/\s+/g, '');
16
+ } else {
17
+ return str;
18
+ }
19
+ }
20
+
21
+ export default trim;
@@ -1,36 +1,36 @@
1
- /**
2
- * 根据主题type值,获取对应的图标
3
- * @param type 主题名称, primary|info|error|warning|success,默认success
4
- * @param fill 是否使用fill填充实体的图标,默认false
5
- * @returns 图标名称字符串
6
- */
7
- function type2icon(type: 'primary' | 'info' | 'error' | 'warning' | 'success' = 'success', fill: boolean = false): string {
8
- // 如果非预置值,默认为success
9
- if (!['primary', 'info', 'error', 'warning', 'success'].includes(type)) type = 'success';
10
- let iconName = '';
11
- // 目前(2019-12-12),info和primary使用同一个图标
12
- switch (type) {
13
- case 'primary':
14
- iconName = 'info-circle';
15
- break;
16
- case 'info':
17
- iconName = 'info-circle';
18
- break;
19
- case 'error':
20
- iconName = 'close-circle';
21
- break;
22
- case 'warning':
23
- iconName = 'error-circle';
24
- break;
25
- case 'success':
26
- iconName = 'checkmark-circle';
27
- break;
28
- default:
29
- iconName = 'checkmark-circle';
30
- }
31
- // 是否是实体类型,加上-fill,在icon组件库中,实体的类名是后面加-fill的
32
- if (fill) iconName += '-fill';
33
- return iconName;
34
- }
35
-
36
- export default type2icon;
1
+ /**
2
+ * 根据主题type值,获取对应的图标
3
+ * @param type 主题名称, primary|info|error|warning|success,默认success
4
+ * @param fill 是否使用fill填充实体的图标,默认false
5
+ * @returns 图标名称字符串
6
+ */
7
+ function type2icon(type: 'primary' | 'info' | 'error' | 'warning' | 'success' = 'success', fill: boolean = false): string {
8
+ // 如果非预置值,默认为success
9
+ if (!['primary', 'info', 'error', 'warning', 'success'].includes(type)) type = 'success';
10
+ let iconName = '';
11
+ // 目前(2019-12-12),info和primary使用同一个图标
12
+ switch (type) {
13
+ case 'primary':
14
+ iconName = 'info-circle';
15
+ break;
16
+ case 'info':
17
+ iconName = 'info-circle';
18
+ break;
19
+ case 'error':
20
+ iconName = 'close-circle';
21
+ break;
22
+ case 'warning':
23
+ iconName = 'error-circle';
24
+ break;
25
+ case 'success':
26
+ iconName = 'checkmark-circle';
27
+ break;
28
+ default:
29
+ iconName = 'checkmark-circle';
30
+ }
31
+ // 是否是实体类型,加上-fill,在icon组件库中,实体的类名是后面加-fill的
32
+ if (fill) iconName += '-fill';
33
+ return iconName;
34
+ }
35
+
36
+ export default type2icon;
@@ -1,77 +1,77 @@
1
- import { type ComponentInternalInstance, getCurrentInstance } from 'vue';
2
-
3
- /**
4
- * 将事件名转换为驼峰格式
5
- * @param str 需要转换的字符串
6
- * @description 例如:on-form-change -> onFormChange
7
- * @returns
8
- */
9
- function formatToCamelCase(str: string): string {
10
- return str.replace(/-([a-z])/g, function (g) {
11
- return g[1].toUpperCase();
12
- });
13
- }
14
-
15
- export function useEmitter(name: string) {
16
- const instance: ComponentInternalInstance | null | undefined = getCurrentInstance();
17
-
18
- /** * 向上查找父组件并派发事件
19
- * @param instance 当前组件实例(setup中可用getCurrentInstance())
20
- * @param componentName 目标组件名
21
- * @param eventName 事件名
22
- * @param params 参数
23
- */
24
- function dispatch(componentName: string, eventName: string, ...params: any[]) {
25
- let parent = instance && (instance.parent as ComponentInternalInstance | null | undefined);
26
- while (parent) {
27
- const name = (parent.type as any)?.name as string | undefined;
28
- if (name === componentName) {
29
- // 找到目标组件,派发事件
30
- // Vue3未解决,目标组件事件监听失效,待优化,暂时使用下面的方式解决,如果你有好的方式也可以告诉我或者提PR
31
- parent.emit && parent.emit(eventName, ...params);
32
- // 如果有对应的方法,执行方法
33
- // 这里可以考虑将 eventName 转换为驼峰格式
34
- // 例如:on-form-change -> onFormChange
35
- parent.exposed?.[formatToCamelCase(eventName)] && parent.exposed[formatToCamelCase(eventName)](...params);
36
- break;
37
- }
38
- parent = parent.parent;
39
- }
40
- }
41
-
42
- /**
43
- * 向下递归查找子组件并广播事件
44
- * @param instance 当前组件实例(setup中可用getCurrentInstance())
45
- * @param componentName 目标组件名
46
- * @param eventName 事件名
47
- * @param params 参数
48
- */
49
- function broadcast(componentName: string, eventName: string, ...params: any[]) {
50
- if (!instance) return;
51
- const subTree = (instance.subTree as any)?.children || [];
52
- const children = Array.isArray(subTree) ? subTree : [subTree];
53
- children.forEach((vnode: any) => {
54
- const child = vnode.component as ComponentInternalInstance | undefined;
55
-
56
- if (child) {
57
- const name = (child.type as any)?.name as string | undefined;
58
- if (name === componentName) {
59
- // 找到目标组件,广播事件
60
- // Vue3未解决,目标组件事件监听失效,待优化,暂时使用下面的方式解决,如果你有好的方式也可以告诉我或者提PR
61
- child.emit && child.emit(eventName, ...params);
62
- // 如果有对应的方法,执行方法
63
- // 这里可以考虑将 eventName 转换为驼峰格式
64
- // 例如:on-form-change -> onFormChange
65
- child.exposed?.[formatToCamelCase(eventName)] && child.exposed[formatToCamelCase(eventName)](...params);
66
- } else {
67
- broadcast.call(child, componentName, eventName, ...params);
68
- }
69
- }
70
- });
71
- }
72
-
73
- return {
74
- dispatch,
75
- broadcast
76
- };
77
- }
1
+ import { type ComponentInternalInstance, getCurrentInstance } from 'vue';
2
+
3
+ /**
4
+ * 将事件名转换为驼峰格式
5
+ * @param str 需要转换的字符串
6
+ * @description 例如:on-form-change -> onFormChange
7
+ * @returns
8
+ */
9
+ function formatToCamelCase(str: string): string {
10
+ return str.replace(/-([a-z])/g, function (g) {
11
+ return g[1].toUpperCase();
12
+ });
13
+ }
14
+
15
+ export function useEmitter(name: string) {
16
+ const instance: ComponentInternalInstance | null | undefined = getCurrentInstance();
17
+
18
+ /** * 向上查找父组件并派发事件
19
+ * @param instance 当前组件实例(setup中可用getCurrentInstance())
20
+ * @param componentName 目标组件名
21
+ * @param eventName 事件名
22
+ * @param params 参数
23
+ */
24
+ function dispatch(componentName: string, eventName: string, ...params: any[]) {
25
+ let parent = instance && (instance.parent as ComponentInternalInstance | null | undefined);
26
+ while (parent) {
27
+ const name = (parent.type as any)?.name as string | undefined;
28
+ if (name === componentName) {
29
+ // 找到目标组件,派发事件
30
+ // Vue3未解决,目标组件事件监听失效,待优化,暂时使用下面的方式解决,如果你有好的方式也可以告诉我或者提PR
31
+ parent.emit && parent.emit(eventName, ...params);
32
+ // 如果有对应的方法,执行方法
33
+ // 这里可以考虑将 eventName 转换为驼峰格式
34
+ // 例如:on-form-change -> onFormChange
35
+ parent.exposed?.[formatToCamelCase(eventName)] && parent.exposed[formatToCamelCase(eventName)](...params);
36
+ break;
37
+ }
38
+ parent = parent.parent;
39
+ }
40
+ }
41
+
42
+ /**
43
+ * 向下递归查找子组件并广播事件
44
+ * @param instance 当前组件实例(setup中可用getCurrentInstance())
45
+ * @param componentName 目标组件名
46
+ * @param eventName 事件名
47
+ * @param params 参数
48
+ */
49
+ function broadcast(componentName: string, eventName: string, ...params: any[]) {
50
+ if (!instance) return;
51
+ const subTree = (instance.subTree as any)?.children || [];
52
+ const children = Array.isArray(subTree) ? subTree : [subTree];
53
+ children.forEach((vnode: any) => {
54
+ const child = vnode.component as ComponentInternalInstance | undefined;
55
+
56
+ if (child) {
57
+ const name = (child.type as any)?.name as string | undefined;
58
+ if (name === componentName) {
59
+ // 找到目标组件,广播事件
60
+ // Vue3未解决,目标组件事件监听失效,待优化,暂时使用下面的方式解决,如果你有好的方式也可以告诉我或者提PR
61
+ child.emit && child.emit(eventName, ...params);
62
+ // 如果有对应的方法,执行方法
63
+ // 这里可以考虑将 eventName 转换为驼峰格式
64
+ // 例如:on-form-change -> onFormChange
65
+ child.exposed?.[formatToCamelCase(eventName)] && child.exposed[formatToCamelCase(eventName)](...params);
66
+ } else {
67
+ broadcast.call(child, componentName, eventName, ...params);
68
+ }
69
+ }
70
+ });
71
+ }
72
+
73
+ return {
74
+ dispatch,
75
+ broadcast
76
+ };
77
+ }
@@ -1,29 +1,29 @@
1
- import { type ComponentInternalInstance, getCurrentInstance } from 'vue'
2
-
3
- export function useParent(name: string) {
4
- const instance: ComponentInternalInstance | null | undefined = getCurrentInstance()
5
-
6
- function getParent(componentName?: string) {
7
- componentName = componentName || name
8
- let parent = instance && (instance.parent as ComponentInternalInstance | null | undefined)
9
-
10
- while (parent) {
11
- const name = (parent.type as any)?.name as string | undefined
12
- if (name === componentName) {
13
- return parent
14
- }
15
- parent = parent.parent
16
- }
17
- return null
18
- }
19
- function getParentData(componentName?: string) {
20
- componentName = componentName || name
21
- const parent = getParent(componentName)
22
- return parent ? parent.exposed : null
23
- }
24
-
25
- return {
26
- getParent,
27
- getParentData
28
- }
29
- }
1
+ import { type ComponentInternalInstance, getCurrentInstance } from 'vue'
2
+
3
+ export function useParent(name: string) {
4
+ const instance: ComponentInternalInstance | null | undefined = getCurrentInstance()
5
+
6
+ function getParent(componentName?: string) {
7
+ componentName = componentName || name
8
+ let parent = instance && (instance.parent as ComponentInternalInstance | null | undefined)
9
+
10
+ while (parent) {
11
+ const name = (parent.type as any)?.name as string | undefined
12
+ if (name === componentName) {
13
+ return parent
14
+ }
15
+ parent = parent.parent
16
+ }
17
+ return null
18
+ }
19
+ function getParentData(componentName?: string) {
20
+ componentName = componentName || name
21
+ const parent = getParent(componentName)
22
+ return parent ? parent.exposed : null
23
+ }
24
+
25
+ return {
26
+ getParent,
27
+ getParentData
28
+ }
29
+ }
@@ -1,76 +1,76 @@
1
- import deepMerge from '../function/deepMerge';
2
-
3
- export function isFunction(f: any): boolean {
4
- return typeof f === 'function';
5
- }
6
-
7
- export function isPromise(p: any): boolean {
8
- return !!(p && p.then && p.catch);
9
- }
10
-
11
- export function isArray(arr: any) {
12
- return Object.prototype.toString.call(arr) === '[object Array]';
13
- }
14
-
15
- /**
16
- * 构建基础类
17
- */
18
- class Builder<T> {
19
- instance: any;
20
-
21
- constructor(instance: any) {
22
- this.instance = instance;
23
- }
24
- /**
25
- *
26
- * @param urlConfig url 配置表
27
- * @param extra 其他请求方法对象
28
- * @returns Object
29
- */
30
- dispatch(urlConfig: Record<string, any>, extra: Record<string, any> = {}): Record<string, any> {
31
- const builder: Record<string, any> = {};
32
- // 创建 API
33
- Object.keys(urlConfig).forEach(name => {
34
- builder[name] = this.use.bind(this, urlConfig[name]);
35
- });
36
- return { ...builder, ...extra };
37
- }
38
- /**
39
- * 发送请求
40
- * @param {*} urlConfig : url 配置表
41
- * @demo urlConfig = { login: { url: '/user/login', method: 'GET', loading: true } }
42
- * @param {*} config : 开放配置,用户主动配置的
43
- * @demo api.login({ params: { username: "admin" } })
44
- * @returns Promise
45
- */
46
- use(urlConfig: Record<string, any>, config: Record<string, any> = {}): Promise<T> {
47
- // 请求地址
48
- let url = config?.url ?? urlConfig.url;
49
- // 兼容 restful url,如果是使用url为function,则为restful格式
50
- if (config.url && isFunction(config.url)) {
51
- url = `${urlConfig.url}${config.url()}`;
52
- }
53
- // 请求类型,get,post,put,delete
54
- const method = config?.method ?? urlConfig?.method ?? 'GET';
55
- // 如果有自定义的工厂函数基础类
56
- const options = { ...deepMerge(urlConfig, config), url, method };
57
- if (isFunction(this.instance) || isPromise(this.instance)) {
58
- return this.instance(options);
59
- }
60
- // 如果是使用的 instance
61
- // 默认的请求基础类
62
- return this.instance.request(options);
63
- }
64
- }
65
-
66
- /**
67
- * Http 基础类
68
- */
69
- class AutoHttp {
70
- static get Builder() {
71
- return Builder;
72
- }
73
- constructor() {}
74
- }
75
-
76
- export { AutoHttp };
1
+ import deepMerge from '../function/deepMerge';
2
+
3
+ export function isFunction(f: any): boolean {
4
+ return typeof f === 'function';
5
+ }
6
+
7
+ export function isPromise(p: any): boolean {
8
+ return !!(p && p.then && p.catch);
9
+ }
10
+
11
+ export function isArray(arr: any) {
12
+ return Object.prototype.toString.call(arr) === '[object Array]';
13
+ }
14
+
15
+ /**
16
+ * 构建基础类
17
+ */
18
+ class Builder<T> {
19
+ instance: any;
20
+
21
+ constructor(instance: any) {
22
+ this.instance = instance;
23
+ }
24
+ /**
25
+ *
26
+ * @param urlConfig url 配置表
27
+ * @param extra 其他请求方法对象
28
+ * @returns Object
29
+ */
30
+ dispatch(urlConfig: Record<string, any>, extra: Record<string, any> = {}): Record<string, any> {
31
+ const builder: Record<string, any> = {};
32
+ // 创建 API
33
+ Object.keys(urlConfig).forEach(name => {
34
+ builder[name] = this.use.bind(this, urlConfig[name]);
35
+ });
36
+ return { ...builder, ...extra };
37
+ }
38
+ /**
39
+ * 发送请求
40
+ * @param {*} urlConfig : url 配置表
41
+ * @demo urlConfig = { login: { url: '/user/login', method: 'GET', loading: true } }
42
+ * @param {*} config : 开放配置,用户主动配置的
43
+ * @demo api.login({ params: { username: "admin" } })
44
+ * @returns Promise
45
+ */
46
+ use(urlConfig: Record<string, any>, config: Record<string, any> = {}): Promise<T> {
47
+ // 请求地址
48
+ let url = config?.url ?? urlConfig.url;
49
+ // 兼容 restful url,如果是使用url为function,则为restful格式
50
+ if (config.url && isFunction(config.url)) {
51
+ url = `${urlConfig.url}${config.url()}`;
52
+ }
53
+ // 请求类型,get,post,put,delete
54
+ const method = config?.method ?? urlConfig?.method ?? 'GET';
55
+ // 如果有自定义的工厂函数基础类
56
+ const options = { ...deepMerge(urlConfig, config), url, method };
57
+ if (isFunction(this.instance) || isPromise(this.instance)) {
58
+ return this.instance(options);
59
+ }
60
+ // 如果是使用的 instance
61
+ // 默认的请求基础类
62
+ return this.instance.request(options);
63
+ }
64
+ }
65
+
66
+ /**
67
+ * Http 基础类
68
+ */
69
+ class AutoHttp {
70
+ static get Builder() {
71
+ return Builder;
72
+ }
73
+ constructor() {}
74
+ }
75
+
76
+ export { AutoHttp };