Skip to content

Commit 02babdc

Browse files
quanquan2100quanquan2100
committed
style(imgUpload): 更新文档
1 parent d5d8ffb commit 02babdc

1 file changed

Lines changed: 32 additions & 20 deletions

File tree

‎src/components/base/upload-imgs/README.md‎

Lines changed: 32 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,13 @@
22

33
多图片上传组件 `UploadImgs`, 附有预览, 排序, 验证等功能 [演示效果](http://face.cms.7yue.pro/#/imgs-upload/stage1)
44

5+
- 开箱即用
6+
- 支持固定上传数量图片上传和不定数量图片上传
7+
- 支持预览
8+
- 支持排序
9+
- 内置图像验证机制
10+
- 内置支持 Lin-CMS 上传接口
11+
512
## 基础示例
613

714
```vue
@@ -37,12 +44,16 @@ export default {
3744

3845
新上传的图像会有完整的图像信息
3946

40-
| 属性 | 类型 | 默认 | 说明 |
41-
| :--------: | :-----: | :--: | :--------: |
42-
| width | Number | null | 图像宽度 |
43-
| height | Number | null | 图像高度 |
44-
| size | Number | null | 文件大小 |
45-
| isAnimated | Boolean | null | 是否是动图 |
47+
| 属性 | 类型 | 默认 | 说明 |
48+
| :--------: | :-----------: | :--: | :----------------------------------------: |
49+
| id | String/Nuber | null | 初始化数据的 id |
50+
| imgId | String/Number | null | 图像资源 id |
51+
| src | String | null | 图像相对地址 |
52+
| display | String | null | 图像完整地址 |
53+
| width | Number | null | 图像宽度 |
54+
| height | Number | null | 图像高度 |
55+
| size | Number | null | 文件大小 |
56+
| isAnimated | Boolean | null | 是否是动图, 只有开启动图检测, 本值才有意义 |
4657

4758
## props
4859

@@ -58,25 +69,25 @@ export default {
5869
| before-upload | Function | null | 上传前自定义校验函数, 返回 true 表示校验成功, 否则校验失败不进行后续上传, 支持返回 Promise |
5970
| remote-fuc | Function | null | 重写远程方法, 支持返回 Promise |
6071
| sortable | Boolean | false | 是否可排序 |
61-
| accept | String | image/\* | 运行上传的类型 |
62-
| animated-check | Boolean | false | 是否需要检测是否是动图 |
72+
| accept | String | image/\* | 允许上传的类型, 同 input 的 accept 属性配置 |
73+
| animated-check | Boolean | false | 是否需要检测是否是动图, 开启后返回数据中 isAnimated 表示是否是动图 |
6374
| rules | Object | {} | 图像规则 |
6475
| fit | String | contain | 图像显示形式 |
65-
| width | Nulber/String | 200 | 宽度 |
66-
| height | Number/String | 200 | 高度 |
76+
| width | Nulber/String | 200 | 组件每项的宽度 |
77+
| height | Number/String | 200 | 组件每项的高度 |
6778

6879
图像验证规则属性 rule 支持的验证规则有:
6980

70-
| 属性 | 类型 | 默认 | 说明 |
71-
| :-----------: | :-----: | :--: | :-------------: |
72-
| ratio | Array | null | 比例 [宽，高] |
73-
| width | Number | null | 宽度必需等于 |
74-
| height | Number | null | 高度必需等于 |
75-
| minWidth | Number | null | 最小宽 |
76-
| minHeight | Number | null | 最小高 |
77-
| minSize | Number | null | 最小 size（Mb） |
78-
| maxSize | Number | null | 最大 size（Mb） |
79-
| allowAnimated | Boolean | true | 最大 size（Mb） |
81+
| 属性 | 类型 | 默认 | 说明 |
82+
| :-----------: | :----: | :--: | :---------------------------------------------------------------------------------------------------: |
83+
| ratio | Array | null | 比例 [宽，高] |
84+
| width | Number | null | 宽度必需等于 |
85+
| height | Number | null | 高度必需等于 |
86+
| minWidth | Number | null | 最小宽 |
87+
| minHeight | Number | null | 最小高 |
88+
| minSize | Number | null | 最小 size（Mb） |
89+
| maxSize | Number | null | 最大 size（Mb） |
90+
| allowAnimated | Number | null | 是否允许上传动图, 0 不检测, 1 不允许动图, 2 只允许动图. 要检查此项, 需设置属性 animated-check 为 true |
8091

8192
默认值为 `{ maxSize: 2 }` 图片文件大小限制 2M 内. 这与 lin-cms 服务端文件上传接口默认限制一致
8293

@@ -86,3 +97,4 @@ export default {
8697
| :------: | :--: | :------------------------------------------: |
8798
| getValue | 无 | 获取当前组件的值, 如果验证不通过则返回 false |
8899
| clear | 无 | 清空当前所选图片 |
100+
| reset | 无 | 重置图片, 回到初始化数据状态(value) |

0 commit comments

Comments
 (0)