@cloudbase/weda-ui-mp 3.12.2 → 3.12.3

package/components/form/uploaderFile/index.js

@@ -1,5 +1,6 @@
 import { getCloudInstance, getTempFileURL } from '../../../utils/tcb';
 import { transSize, randomStr } from '../../../utils/platform';
+import equal from '../../../utils/deepEqual';
 
 Component({
   options: {
@@ -24,6 +25,9 @@ Component({
     defaultValue: {
       type: null,
     },
+    oldValue: {
+      type: null,
+    },
     maxUploadCount: {
       type: Number,
       value: 9,
@@ -105,10 +109,7 @@ Component({
         });
         return false;
       }
-      if (
-        this.properties.maxSize &&
-        files.some((f) => f.size > this.properties.maxSize * 1024 * 1024)
-      ) {
+      if (this.properties.maxSize && files.some((f) => f.size > this.properties.maxSize * 1024 * 1024)) {
         wx.showToast({
           title: `上传文件大小不能超过${this.properties.maxSize}M`,
           icon: 'none',
@@ -154,6 +155,13 @@ Component({
         },
       });
     },
+    getName: function (hf) {
+      const uuidReg = /[0-9a-f]{8}([0-9a-f]{4}){3}[0-9a-f]{12}-/;
+      const lastIndex = String(hf).lastIndexOf('/');
+      const name = String(hf).slice(lastIndex + 1);
+      const label = name.replace(uuidReg, '');
+      return label;
+    },
     handleUpload: async function (files, reload = false) {
       var _this = this;
       if (!this.handleBefore(files)) return;
@@ -172,10 +180,7 @@ Component({
           });
           if (typeof ret === 'boolean') {
             shouldUploadToCos = ret;
-          } else if (
-            Array.Array(ret) &&
-            ret.every((i) => typeof i === 'string')
-          ) {
+          } else if (Array.Array(ret) && ret.every((i) => typeof i === 'string')) {
             files = ret.map((path, idx) => {
               files[idx].path = path;
             });
@@ -193,14 +198,12 @@ Component({
         ...i,
         percent: '0',
         cloudPath: null,
-        name: i?.name || i?.tempFilePath.slice(9),
+        name: i?.name || this.getName(i?.tempFilePath),
         filePath: i?.path || i?.tempFilePath || null,
         size: transSize(i?.size),
         status: 'pending',
       }));
-      let filelsList = reload
-        ? this.data.files
-        : [...this.data.files, ...initFiles];
+      let filelsList = reload ? this.data.files : [...this.data.files, ...initFiles];
       this.setData({
         files: filelsList,
       });
@@ -210,9 +213,7 @@ Component({
             _this.handleUploadFile({
               _tempFile: tempFile,
               onSuccess: (res) => {
-                filelsList = filelsList.map((i) =>
-                  i.filePath === res.filePath ? res : i
-                );
+                filelsList = filelsList.map((i) => (i.filePath === res.filePath ? res : i));
                 _this.triggerEvent('success', {
                   value: res.cloudPath,
                   file: res,
@@ -220,30 +221,22 @@ Component({
                 resolve(res);
               },
               onProgressUpdate: (res) => {
-                filelsList = filelsList.map((i) =>
-                  i.filePath === res.filePath ? res : i
-                );
+                filelsList = filelsList.map((i) => (i.filePath === res.filePath ? res : i));
                 _this.setData({
                   files: filelsList,
                 });
               },
               onFail: (res, error) => {
-                filelsList = filelsList.map((i) =>
-                  i.filePath === res.filePath ? res : i
-                );
+                filelsList = filelsList.map((i) => (i.filePath === res.filePath ? res : i));
                 _this.triggerEvent('error', error.detail);
                 resolve(res);
               },
             });
           });
-        })
+        }),
       ).then((res) => {
-        const result = filelsList.map(
-          (i) => res.find((j) => j.filePath === i.filePath) || i
-        );
-        const cloudPathList = result
-          .filter((i) => i.cloudPath)
-          .map((j) => j.cloudPath);
+        const result = filelsList.map((i) => res.find((j) => j.filePath === i.filePath) || i);
+        const cloudPathList = result.filter((i) => i.cloudPath).map((j) => j.cloudPath);
         this.setData({
           files: result,
           urls: cloudPathList,
@@ -252,12 +245,7 @@ Component({
         _this.handleChange(cloudPathList);
       });
     },
-    handleUploadFile: async function ({
-      _tempFile,
-      onSuccess,
-      onProgressUpdate,
-      onFail,
-    }) {
+    handleUploadFile: async function ({ _tempFile, onSuccess, onProgressUpdate, onFail }) {
       const tempFile = {
         ..._tempFile,
       };
@@ -324,20 +312,15 @@ Component({
           }
         });
         this.setData({
-          files: this.data.files.filter(
-            (v) => e.target.dataset.item.cloudPath !== v.cloudPath
-          ),
+          files: this.data.files.filter((v) => e.target.dataset.item.cloudPath !== v.cloudPath),
           urls: newUrls,
         });
       } else {
         const filelist = this.data.files.filter(
           (item) =>
-            e.target.dataset.item?.path != item?.path ||
-            e.target.dataset.item?.tempFilePath != item?.tempFilePath
-        );
-        newUrls = this.data.urls.filter(
-          (v) => e.target.dataset.item?.cloudPath != v
+            e.target.dataset.item?.path != item?.path || e.target.dataset.item?.tempFilePath != item?.tempFilePath,
         );
+        newUrls = this.data.urls.filter((v) => e.target.dataset.item?.cloudPath != v);
         this.setData({
           files: filelist,
           urls: newUrls,
@@ -352,6 +335,7 @@ Component({
       if (this.properties.single) {
         value = values[0] ?? '';
       }
+      this.setData({ oldValue: value });
       this.triggerEvent('change', { value });
     },
 
@@ -428,6 +412,9 @@ Component({
   },
   observers: {
     defaultValue: async function (value) {
+      if (equal(this.data.oldValue, value)) {
+        return;
+      }
       //当单图片上传且默认值为空数组时，初次渲染更新value，以避免空串提交类型不匹配问题
       if (Array.isArray(value) && !this.data.singleFlag) {
         this.setData({
@@ -441,10 +428,7 @@ Component({
         for (let f of values) {
           if (f.startsWith('cloud:')) {
             const hf = await getTempFileURL(f);
-            const uuidReg = /[0-9a-f]{8}([0-9a-f]{4}){3}[0-9a-f]{12}-/;
-            const lastIndex = String(hf).lastIndexOf('/');
-            const name = String(hf).slice(lastIndex + 1);
-            const label = name.replace(uuidReg, '');
+            const label = this.getName(hf);
             const httpFile = {
               name: label,
               cloudPath: f,
@@ -455,19 +439,14 @@ Component({
             httpFiles.push(httpFile);
           }
         }
-        const files = this.data.files;
-        // 文件上传成功也会触发defaultValue变化，此情况不执行初始化文件列表
-        if (!files?.length) {
-          this.setData({
-            files: httpFiles,
-            cloudFile:
-              JSON.stringify(value) != JSON.stringify(this.data.cloudFile)
-                ? [].concat(value)
-                : [],
-          });
-        }
+        this.setData({
+          oldValue: value,
+          files: httpFiles,
+          cloudFile: JSON.stringify(value) != JSON.stringify(this.data.cloudFile) ? [].concat(value) : [],
+        });
       } else {
         this.setData({
+          oldValue: value,
           files: [],
           cloudFile: [],
         });
@@ -481,8 +460,7 @@ Component({
     },
     'layout,extClass': function (layout, extClass) {
       const temp = `weda-formcells weui-cells weui-cells_forms ${extClass}`;
-      const layoutCls =
-        layout !== 'vertical' ? ` weui-flex ${temp}` : `${temp}`;
+      const layoutCls = layout !== 'vertical' ? ` weui-flex ${temp}` : `${temp}`;
       this.setData({ layoutCls });
     },
   },

package/components/form/uploaderFile/index.wxss

@@ -31,7 +31,7 @@
 /* theme */
 .weda-uploader-files__btn {
   margin: 0;
-  width: 88px;
+  width: auto;
   height: 32px;
   padding: 0;
   display: flex;
@@ -132,27 +132,19 @@
 }
 
 /* 标准化样式适配 start */
-.wd-form-item.wd-mp-upload-file-root
-  .weda-uploader-files
-  .weda-uploader-files__btn-contain {
+.wd-form-item.wd-mp-upload-file-root .weda-uploader-files .weda-uploader-files__btn-contain {
   padding: 0;
 }
 
-.wd-form-item.wd-mp-upload-file-root
-  .weda-uploader-files
-  .weda-uploader-files__file-status {
+.wd-form-item.wd-mp-upload-file-root .weda-uploader-files .weda-uploader-files__file-status {
   width: auto;
 }
 
-.wd-form-item.wd-mp-upload-file-root
-  .weda-uploader-files
-  .weda-uploader-files__file-foot {
+.wd-form-item.wd-mp-upload-file-root .weda-uploader-files .weda-uploader-files__file-foot {
   margin: 0;
 }
 
-.wd-form-item.wd-mp-upload-file-root
-  .weda-uploader-files
-  .weda-uploader-files__item {
+.wd-form-item.wd-mp-upload-file-root .weda-uploader-files .weda-uploader-files__item {
   padding: 0;
 }
 

package/package.json

@@ -3,7 +3,7 @@
   "miniprogram": "./",
   "packageManager": "yarn@3.0.2",
   "dependencies": {},
-  "version": "3.12.2",
+  "version": "3.12.3",
   "main": "./",
   "publishConfig": {
     "access": "public"