Browse Source

fix(uploader): 修改bug

richard1015 3 years ago
parent
commit
05407dd5af

+ 30 - 5
src/packages/__VUE/uploader/demo.vue

@@ -6,7 +6,7 @@
     <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList" @delete="onDelete" maximum="3" multiple>
     </nut-uploader>
     <h2>{{ translate('title2') }}</h2>
-    <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList" maximum="10" multiple list-type="list">
+    <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList1" maximum="10" multiple list-type="list">
       <nut-button type="success" size="small">{{ translate('uploadfile') }}</nut-button>
     </nut-uploader>
     <h2>{{ translate('title3') }}</h2>
@@ -51,6 +51,7 @@ import { ref, reactive } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { createDemo, translate } = createComponent('uploader');
 import { useTranslate } from '@/sites/assets/util/useTranslate';
+import { showToast } from '../toast/index';
 const initTranslate = () =>
   useTranslate({
     'zh-CN': {
@@ -59,7 +60,7 @@ const initTranslate = () =>
       title1: '上传状态',
       title2: '基础用法-上传列表展示',
       title3: '自定义上传样式',
-      title4: '自定义上传使用默认进度条',
+      title4: '自定义上传配合使用默认进度条',
       title5: '直接调起摄像头(移动端生效)',
       title6: '限制上传数量5个',
       title7: '限制上传大小(每个文件最大不超过 50kb)',
@@ -122,6 +123,29 @@ export default createDemo({
         type: 'image'
       }
     ]);
+    const defaultFileList1 = reactive([
+      {
+        name: 'file 1.png',
+        url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+        status: 'success',
+        message: translate('success'),
+        type: 'image'
+      },
+      {
+        name: 'file 2.png',
+        url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+        status: 'error',
+        message: translate('error'),
+        type: 'image'
+      },
+      {
+        name: 'file 3.png',
+        url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+        status: 'uploading',
+        message: translate('uploading'),
+        type: 'image'
+      }
+    ]);
     const fileToDataURL = (file: Blob): Promise<any> => {
       return new Promise((resolve) => {
         const reader = new FileReader();
@@ -140,14 +164,14 @@ export default createDemo({
       return new Promise((resolve) => canvas.toBlob((blob) => resolve(blob), type, quality));
     };
     const onOversize = (files: File[]) => {
-      console.log('oversize 触发 文件大小不能超过 50kb', files);
+      showToast.text('oversize 触发 文件大小不能超过 50kb');
     };
     const onDelete = (obj: any) => {
-      console.log('delete 事件触发', obj);
+      showToast.text('delete 事件触发');
     };
     const onProgress = ({ event, options, percentage }: any) => {
       progressPercentage.value = percentage;
-      console.log('progress 事件触发', percentage);
+      showToast.text('progress 事件触发' + percentage);
     };
     const beforeUpload = async (file: File[]) => {
       let fileName = file[0].name;
@@ -188,6 +212,7 @@ export default createDemo({
       progressPercentage,
       uploadUrl,
       defaultFileList,
+      defaultFileList1,
       formData,
       uploadRef,
       submitUpload,

+ 41 - 36
src/packages/__VUE/uploader/doc.en-US.md

@@ -142,13 +142,15 @@ export default {
 </template>
 <script lang="ts">
 import { ref } from 'vue';
+import { showToast } from '@nutui/nutui';
+import "@nutui/nutui/dist/packages/toast/style";
 export default {
   setup() {
      const uploadUrl = 'https://xxxxx';
      const progressPercentage = ref<string | number>(0);
      const onProgress = ({ event, options, percentage }: any) => {
         progressPercentage.value = percentage;
-        console.log('progress 事件触发', percentage);
+        showToast.text('progress 事件触发'+ percentage);
      };
      return {
       uploadUrl,
@@ -189,11 +191,13 @@ export default {
 </template>
 <script lang="ts">
 import { ref } from 'vue';
+import { showToast } from '@nutui/nutui';
+import "@nutui/nutui/dist/packages/toast/style";
 export default {
   setup() {
       const uploadUrl = 'https://xxxxx';
       const onOversize = (files: File[]) => {
-        console.log('oversize limit upload size (up to 50kb per file)', files);
+        showToast.text('oversize limit upload size (up to 50kb per file)');
       };
      return {
       uploadUrl,
@@ -360,44 +364,45 @@ export default {
 ## API
 ### Props
 
-| Attribute         | Description                                                                                                                                      | Type                                       | Default          |
-|-------------------|--------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------|------------------|
-| auto-upload       | Whether to upload the file immediately after selecting it, if false, you need to manually execute the ref submit method to upload                | boolean                                    | `true`             |
-| name              | The name of the `input` tag `name`, the file parameter name sent to the background                                                               | string                                     | `"file"`           |
-| url               | The interface address of the upload server                                                                                                       | string                                     | -                |
-| v-model:file-list | List of uploaded files by default                                                                                                                | FileItem[]                                 | `[]`               |
-| is-preview        | Whether to display the preview image after the upload is successful                                                                              | boolean                                    | true             |
-| is-deletable      | Whether to display the delete button                                                                                                             | boolean                                    | `true`             |
-| method            | The http method of upload request                                                                                                                | string                                     | `"post"`           |
-| list-type         | Built-in stylesheets, support for three types: `picture`、`list`                                                                                 | string                                     | "picture"        |
-| capture           | Capture, can be set to [camera](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture),turn on the camera directly | string                                     | false            |
-| maximize          | You can set the maximum upload file size (bytes)                                                                                                 | number \| string                           | `Number.MAX_VALUE` |
-| maximum           | File upload limit                                                                                                                                | number \| string                           | `1`                |
-| clear-input       | Whether to clear the `input` content, set to `true` to support repeated selection and upload of the same file                                    | boolean                                    | `true`             |
-| accept            | File types that can be accepted. See [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept)       | string                                     | *                |
-| headers           | Set request headers                                                                                                                              | object                                     | `{} `              |
-| data              | Uploading extra params or function which can return uploading extra params                                                                       | object                                     | {}               |
-| upload-icon-size  | Upload area [icon size] (#/en-US/component/icon) size, such as `20px` `2em` `2rem`                                                               | string \| object                           | -                |
-| xhr-state         | The success status (status) value of the interface response                                                                                      | number                                     | `200`              |
-| with-credentials  | The ajax upload with cookie sent                                                                                                                 | boolean                                    | `false`            |
-| multiple          | Whether to support multiple file selection                                                                                                       | boolean                                    | `false`            |
-| disabled          | Whether to disable file upload                                                                                                                   | boolean                                    | `false`            |
-| timeout           | timeout, in milliseconds                                                                                                                         | number \| string                           | `1000 * 30 `       |
-| before-upload     | Hook before reading the file, return false to stop reading the file, can return Promise                                                          | Function                                   | `null`             |
-| before-xhr-upload | Customize the method when uploading XHR                                                                                                          | Function(xhr,option)                      | `null`             |
-| before-delete     | Hook before delete the file, return false to stop reading the file, can return Promise                                                           | Function(file,fileList): boolean `丨Promise` | -                |
+| Attribute         | Description                                                                                                                                      | Type                                         | Default            |
+|-------------------|--------------------------------------------------------------------------------------------------------------------------------------------------|----------------------------------------------|--------------------|
+| auto-upload       | Whether to upload the file immediately after selecting it, if false, you need to manually execute the ref submit method to upload                | boolean                                      | `true`             |
+| name              | The name of the `input` tag `name`, the file parameter name sent to the background                                                               | string                                       | `"file"`           |
+| url               | The interface address of the upload server                                                                                                       | string                                       | -                  |
+| v-model:file-list | List of uploaded files by default                                                                                                                | FileItem[]                                   | `[]`               |
+| is-preview        | Whether to display the preview image after the upload is successful                                                                              | boolean                                      | true               |
+| is-deletable      | Whether to display the delete button                                                                                                             | boolean                                      | `true`             |
+| method            | The http method of upload request                                                                                                                | string                                       | `"post"`           |
+| list-type         | Built-in stylesheets, support for three types: `picture`、`list`                                                                                 | string                                       | "picture"          |
+| capture           | Capture, can be set to [camera](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture),turn on the camera directly | string                                       | false              |
+| maximize          | You can set the maximum upload file size (bytes)                                                                                                 | number \| string                             | `Number.MAX_VALUE` |
+| maximum           | File upload limit                                                                                                                                | number \| string                             | `1`                |
+| clear-input       | Whether to clear the `input` content, set to `true` to support repeated selection and upload of the same file                                    | boolean                                      | `true`             |
+| accept            | File types that can be accepted. See [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept)       | string                                       | *                  |
+| headers           | Set request headers                                                                                                                              | object                                       | `{} `              |
+| data              | Uploading extra params or function which can return uploading extra params                                                                       | object                                       | {}                 |
+| upload-icon-size  | Upload area [icon size] (#/en-US/component/icon) size, such as `20px` `2em` `2rem`                                                               | string \| object                             | -                  |
+| xhr-state         | The success status (status) value of the interface response                                                                                      | number                                       | `200`              |
+| with-credentials  | The ajax upload with cookie sent                                                                                                                 | boolean                                      | `false`            |
+| multiple          | Whether to support multiple file selection                                                                                                       | boolean                                      | `false`            |
+| disabled          | Whether to disable file upload                                                                                                                   | boolean                                      | `false`            |
+| timeout           | timeout, in milliseconds                                                                                                                         | number \| string                             | `1000 * 30 `       |
+| before-upload     | Hook before reading the file, return false to stop reading the file, can return Promise                                                          | Function                                     | `null`             |
+| before-xhr-upload | Customize the method when uploading XHR                                                                                                          | Function(xhr,option)                        | `null`             |
+| before-delete     | Hook before delete the file, return false to stop reading the file, can return Promise                                                           | Function(file,fileList): boolean `丨Promise` | -                  |
 
 
 ### FileItem
 
-| Attribute | Description                                                 | Default                         |
-|-----------|-------------------------------------------------------------|---------------------------------|
-| status    | File status value, optional 'ready,uploading,success,error' | `"ready" `                        |
-| uid       | Unique ID of the file                                       | `new Date().getTime().toString()` |
-| name      | File name                                                   | ""                              |
-| url       | File path                                                   | ""                              |
-| type      | File type                                                   | `"image/jpeg" `                   |
-| formData  | Upload the required data                                    | `new FormData()`                  |
+| Attribute  | Description                                                 | Default                           |
+|------------|-------------------------------------------------------------|-----------------------------------|
+| status     | File status value, optional 'ready,uploading,success,error' | `"ready" `                        |
+| uid        | Unique ID of the file                                       | `new Date().getTime().toString()` |
+| name       | File name                                                   | -                                 |
+| url        | File path                                                   | -                                 |
+| type       | File type                                                   | `"image/jpeg" `                   |
+| formData   | Upload the required data                                    | `new FormData()`                  |
+| percentage | Upload percentage                                           | `0`                               |
 
 ### Events
 

+ 41 - 36
src/packages/__VUE/uploader/doc.md

@@ -142,13 +142,15 @@ export default {
 </template>
 <script lang="ts">
 import { ref } from 'vue';
+import { showToast } from '@nutui/nutui';
+import "@nutui/nutui/dist/packages/toast/style";
 export default {
   setup() {
      const uploadUrl = 'https://xxxxx';
      const progressPercentage = ref<string | number>(0);
      const onProgress = ({ event, options, percentage }: any) => {
         progressPercentage.value = percentage;
-        console.log('progress 事件触发', percentage);
+        showToast.text('progress 事件触发'+percentage);
      };
      return {
       uploadUrl,
@@ -189,11 +191,13 @@ export default {
 </template>
 <script lang="ts">
 import { ref } from 'vue';
+import { showToast } from '@nutui/nutui';
+import "@nutui/nutui/dist/packages/toast/style";
 export default {
   setup() {
       const uploadUrl = 'https://xxxxx';
       const onOversize = (files: File[]) => {
-        console.log('oversize 触发 文件大小不能超过 50kb', files);
+        showToast.text('oversize 触发 文件大小不能超过 50kb');
       };
      return {
       uploadUrl,
@@ -360,48 +364,49 @@ export default {
 ## API
 ### Props
 
-| 参数              | 说明                                                                                                                   | 类型                                       | 默认值           |
-|-------------------|------------------------------------------------------------------------------------------------------------------------|--------------------------------------------|------------------|
-| auto-upload       | 是否在选取文件后立即进行上传,false 时需要手动执行 ref submit 方法进行上传                                             | boolean                                    | `true`             |
-| name              | `input` 标签 `name` 的名称,发到后台的文件参数名                                                                       | string                                     | `"file"`           |
-| url               | 上传服务器的接口地址                                                                                                   | string                                     | -                |
-| v-model:file-list | 默认已经上传的文件列表                                                                                                 | FileItem[]                                 | `[]`               |
-| is-preview        | 是否上传成功后展示预览图                                                                                               | boolean                                    | `true`             |
-| is-deletable      | 是否展示删除按钮                                                                                                       | boolean                                    | `true`             |
-| method            | 上传请求的 http method                                                                                                 | string                                     | `"post"`           |
-| list-type         | 上传列表的内建样式,支持两种基础样式 picture、list                                                                     | string                                     | `"picture"`        |
-| capture           | 图片[选取模式](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture),直接调起摄像头     | string                                     | `false`            |
-| maximize          | 可以设定最大上传文件的大小(字节)                                                                                     | number \| string                           | `Number.MAX_VALUE` |
-| maximum           | 文件上传数量限制                                                                                                       | number \| string                           | `1`                |
-| clear-input       | 是否需要清空`input`内容,设为`true`支持重复选择上传同一个文件                                                          | boolean                                    | `true`             |
-| accept            | 允许上传的文件类型,[详细说明](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file)                   | string                                     | `* `               |
-| headers           | 设置上传的请求头部                                                                                                     | object                                     | `{}`               |
-| data              | 附加上传的信息 formData                                                                                                | object                                     | `{}`               |
-| xhr-state         | 接口响应的成功状态(status)值                                                                                         | number                                     | `200`              |
-| with-credentials  | 支持发送 cookie 凭证信息                                                                                               | boolean                                    | `false`            |
-| multiple          | 是否支持文件多选                                                                                                       | boolean                                    | `false`            |
-| disabled          | 是否禁用文件上传                                                                                                       | boolean                                    | `false`            |
-| timeout           | 超时时间,单位为毫秒                                                                                                   | number \| string                           | `1000 * 30`        |
-| before-upload     | 上传前的函数需要返回一个`Promise`对象                                                                                  | Function                                   | `null`             |
-| before-xhr-upload | 执行 XHR 上传时,自定义方式                                                                                            | Function(xhr,option)                      | `null`             |
-| before-delete     | 除文件时的回调,返回值为 false 时不移除。支持返回一个 `Promise` 对象,`Promise` 对象 resolve(false) 或 reject 时不移除 | Function(file,fileList): boolean `丨Promise` | -                |
+| 参数              | 说明                                                                                                                   | 类型                                         | 默认值             |
+|-------------------|------------------------------------------------------------------------------------------------------------------------|----------------------------------------------|--------------------|
+| auto-upload       | 是否在选取文件后立即进行上传,false 时需要手动执行 ref submit 方法进行上传                                             | boolean                                      | `true`             |
+| name              | `input` 标签 `name` 的名称,发到后台的文件参数名                                                                       | string                                       | `"file"`           |
+| url               | 上传服务器的接口地址                                                                                                   | string                                       | -                  |
+| v-model:file-list | 默认已经上传的文件列表                                                                                                 | FileItem[]                                   | `[]`               |
+| is-preview        | 是否上传成功后展示预览图                                                                                               | boolean                                      | `true`             |
+| is-deletable      | 是否展示删除按钮                                                                                                       | boolean                                      | `true`             |
+| method            | 上传请求的 http method                                                                                                 | string                                       | `"post"`           |
+| list-type         | 上传列表的内建样式,支持两种基础样式 picture、list                                                                     | string                                       | `"picture"`        |
+| capture           | 图片[选取模式](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture),直接调起摄像头     | string                                       | `false`            |
+| maximize          | 可以设定最大上传文件的大小(字节)                                                                                     | number \| string                             | `Number.MAX_VALUE` |
+| maximum           | 文件上传数量限制                                                                                                       | number \| string                             | `1`                |
+| clear-input       | 是否需要清空`input`内容,设为`true`支持重复选择上传同一个文件                                                          | boolean                                      | `true`             |
+| accept            | 允许上传的文件类型,[详细说明](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file)                   | string                                       | `* `               |
+| headers           | 设置上传的请求头部                                                                                                     | object                                       | `{}`               |
+| data              | 附加上传的信息 formData                                                                                                | object                                       | `{}`               |
+| xhr-state         | 接口响应的成功状态(status)值                                                                                         | number                                       | `200`              |
+| with-credentials  | 支持发送 cookie 凭证信息                                                                                               | boolean                                      | `false`            |
+| multiple          | 是否支持文件多选                                                                                                       | boolean                                      | `false`            |
+| disabled          | 是否禁用文件上传                                                                                                       | boolean                                      | `false`            |
+| timeout           | 超时时间,单位为毫秒                                                                                                   | number \| string                             | `1000 * 30`        |
+| before-upload     | 上传前的函数需要返回一个`Promise`对象                                                                                  | Function                                     | `null`             |
+| before-xhr-upload | 执行 XHR 上传时,自定义方式                                                                                            | Function(xhr,option)                        | `null`             |
+| before-delete     | 除文件时的回调,返回值为 false 时不移除。支持返回一个 `Promise` 对象,`Promise` 对象 resolve(false) 或 reject 时不移除 | Function(file,fileList): boolean `丨Promise` | -                  |
 
 > 注意:accept、capture 和 multiple 为浏览器 input 标签的原生属性,移动端各种机型对这些属性的支持程度有所差异,因此在不同机型和 WebView 下可能出现一些兼容性问题。
 
 ### FileItem
 
-| 名称     | 说明                                            | 默认值                          |
-|----------|-------------------------------------------------|---------------------------------|
-| status   | 文件状态值,可选'ready,uploading,success,error' | `"ready"`                         |
-| uid      | 文件的唯一标识                                  | `new Date().getTime().toString()` |
-| name     | 文件名称                                        | ""                              |
-| url      | 文件路径                                        | ""                              |
-| type     | 文件类型                                        | `"image/jpeg"`                    |
-| formData | 上传所需的data                                  | `new FormData() `                 |
+| 名称       | 说明                                            | 默认值                            |
+|------------|-------------------------------------------------|-----------------------------------|
+| status     | 文件状态值,可选'ready,uploading,success,error' | `"ready"`                         |
+| uid        | 文件的唯一标识                                  | `new Date().getTime().toString()` |
+| name       | 文件名称                                        | -                                 |
+| url        | 文件路径                                        | -                                 |
+| type       | 文件类型                                        | `"image/jpeg"`                    |
+| formData   | 上传所需的data                                  | `new FormData() `                 |
+| percentage | 上传百分比                                      | `0`                               |
 
 ### Events
 
-| 事件名            | 说明                   | 回调参数                       |
+| 事件名          | 说明                   | 回调参数                       |
 |-----------------|------------------------|--------------------------------|
 | start           | 文件上传开始           | options                        |
 | progress        | 文件上传的进度         | {event,option,percentage}      |

+ 17 - 21
src/packages/__VUE/uploader/doc.taro.md

@@ -59,11 +59,6 @@ app.use(Uploader);
 <nut-uploader :url="uploadUrl" :source-type="['camera']" ></nut-uploader>
 ```
 
-### 上传状态
-```html
-<nut-uploader :url="uploadUrl" @delete="onDelete"></nut-uploader>
-```
-
 ### 限制上传数量5个
 
 ``` html
@@ -233,16 +228,16 @@ setup() {
 ## API
 ### Props
 
-| 参数              | 说明                                                                                                             | 类型                              | 默认值                    |
-|-------------------|------------------------------------------------------------------------------------------------------------------|-----------------------------------|---------------------------|
+| 参数              | 说明                                                                                                             | 类型                              | 默认值                      |
+|-------------------|------------------------------------------------------------------------------------------------------------------|-----------------------------------|-----------------------------|
 | auto-upload       | 是否在选取文件后立即进行上传,false 时需要手动执行 ref submit 方法进行上传                                       | boolean                           | `true`                      |
-| name              | 发到后台的文件参数名                                                                                             | string                            | `file`                    |
+| name              | 发到后台的文件参数名                                                                                             | string                            | `file`                      |
 | url               | 上传服务器的接口地址                                                                                             | string                            | `-`                         |
 | v-model:file-list | 默认已经上传的文件列表                                                                                           | FileItem[]                        | `[]`                        |
 | is-preview        | 是否上传成功后展示预览图                                                                                         | boolean                           | `true`                      |
 | is-deletable      | 是否展示删除按钮                                                                                                 | boolean                           | `true`                      |
-| method            | 上传请求的 http method                                                                                           | string                            | `post`                    |
-| list-type         | 上传列表的内建样式,支持两种基础样式 `picture`、`list`                                                               | string                            | `picture`                 |
+| method            | 上传请求的 http method                                                                                           | string                            | `post`                      |
+| list-type         | 上传列表的内建样式,支持两种基础样式 `picture`、`list`                                                           | string                            | `picture`                   |
 | source-type       | [选择图片的来源](https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseImage.html)           | string                            | `['album','camera']`        |
 | maximize          | 可以设定最大上传文件的大小(字节)                                                                               | number \| string                  | `9`                         |
 | maximum           | 文件上传数量限制                                                                                                 | number \| string                  | `1`                         |
@@ -253,23 +248,24 @@ setup() {
 | disabled          | 是否禁用文件上传                                                                                                 | boolean                           | `false`                     |
 | multiple          | 是否支持文件多选                                                                                                 | boolean                           | `true`                      |
 | timeout           | 超时时间,单位为毫秒                                                                                             | number \| string                  | `1000 * 30`                 |
-| before-upload     | 上传前的函数需要返回一个`Promise`对象                                                                            | Function                          | `null`                     |
+| before-upload     | 上传前的函数需要返回一个`Promise`对象                                                                            | Function                          | `null`                      |
 | before-xhr-upload | 执行 Taro.uploadFile 上传时,自定义方式                                                                          | Function(Taro.uploadFile,option) | `null`                      |
 
 
 ### FileItem
 
-| 名称     | 说明                                            | 默认值                          |
-|----------|-------------------------------------------------|---------------------------------|
-| status   | 文件状态值,可选'ready,uploading,success,error' | `ready`                         |
-| uid      | 文件的唯一标识                                  | `new Date().getTime().toString()` |
-| name     | 文件名称                                        | `""`                              |
-| url      | 文件路径                                        | `""`                              |
-| formData | 上传所需的data                                  | `{}`                              |
+| 名称       | 说明                                            | 默认值                            |
+|------------|-------------------------------------------------|-----------------------------------|
+| status     | 文件状态值,可选'ready,uploading,success,error' | `ready`                           |
+| uid        | 文件的唯一标识                                  | `new Date().getTime().toString()` |
+| name       | 文件名称                                        | -                                 |
+| url        | 文件路径                                        | -                                 |
+| formData   | 上传所需的data                                  | `{}`                              |
+| percentage | 上传百分比                                      | `0`                               |
 
 ### Events
 
-| 事件名            | 说明                   | 回调参数                  |
+| 事件名          | 说明                   | 回调参数                  |
 |-----------------|------------------------|---------------------------|
 | start           | 文件上传开始           | options                   |
 | progress        | 文件上传的进度         | {event,option,percentage} |
@@ -296,8 +292,8 @@ setup() {
 
 | 方法名           | 说明                                                       | 参数  | 返回值 |
 |------------------|------------------------------------------------------------|-------|--------|
-| submit           | 手动上传模式,执行上传操作                                 | -     | `-`      |
-| clearUploadQueue | 清空已选择的文件队列(该方法一般配合在手动模式上传时使用) | index | `-`      |
+| submit           | 手动上传模式,执行上传操作                                 | -     | `-`    |
+| clearUploadQueue | 清空已选择的文件队列(该方法一般配合在手动模式上传时使用) | index | `-`    |
 
 ## 主题定制
 

+ 1 - 1
src/packages/__VUE/uploader/index.scss

@@ -39,7 +39,7 @@
     cursor: pointer !important;
     opacity: 0;
     &:disabled {
-      cursor: not-allowed;
+      cursor: not-allowed !important;
     }
   }
 

+ 25 - 1
src/sites/mobile-taro/vue/src/dentry/pages/uploader/index.vue

@@ -7,7 +7,7 @@
     <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList" maximum="3" multiple @delete="onDelete">
     </nut-uploader>
     <h2>基础用法-上传列表展示</h2>
-    <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList" maximum="10" multiple list-type="list">
+    <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList1" maximum="10" multiple list-type="list">
       <nut-button type="success" size="small">上传文件</nut-button>
     </nut-uploader>
     <h2>自定义上传样式</h2>
@@ -91,6 +91,29 @@ export default {
         type: 'image'
       }
     ]);
+    const defaultFileList1 = reactive([
+      {
+        name: '文件1.png',
+        url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+        status: 'success',
+        message: '上传成功',
+        type: 'image'
+      },
+      {
+        name: '文件2.png',
+        url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+        status: 'error',
+        message: '上传失败',
+        type: 'image'
+      },
+      {
+        name: '文件3.png',
+        url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+        status: 'uploading',
+        message: '上传中...',
+        type: 'image'
+      }
+    ]);
     const onOversize = (files: File[]) => {
       console.log('oversize 触发 文件大小不能超过 50kb', files);
     };
@@ -149,6 +172,7 @@ export default {
       progressPercentage,
       uploadUrl,
       defaultFileList,
+      defaultFileList1,
       formData,
       uploadRef,
       submitUpload,