10.md 3.9 KB

技术文档

打开导航菜单

PIG AI Guide

切换主题搜索

[](https://wwads.cn/click/bait)[![](https://cdn.wwads.cn/creatives/U3n343DCMimUvbTZX1xnbYkOoPlTBBVBjzP4bqjf.jpg) ](https://wwads.cn/click/bundle?code=ajZTgGgWudQ8jFBWxiOCY1T5Qly4mg)

🔥码云GVP开源项目 16k star Uniapp + ElementUI 功能强大 支持多语言、二开方便广告

PIGX 技术指南

适配 5.0 以上单体和微服务版本

PIGX 技术指南PIG

⌘K

参与开发

快速上手

前端部分

功能使用

后端部分

扩展必看

生产部署

社区分享

更新日志

更新日期: 2025-10-23

最后更新: 2025/8/19

切换主题

前端上传组件

[](#普通文件上传)普通文件上传



`<upload-file  @change="success"  />`




[](#属性说明)属性说明

属性名称 描述 类型 默认值

modelValue

|

组件的值

|

string

|

Array

| |

limit

|

数量限制

|

number (非必传)

|

5

| |

fileSize

|

文件大小限制

|

number (非必传)

|

5MB

| |

fileType

|

文件类型限制

|

Array (非必传)

|

['png', 'jpg', 'jpeg', 'doc', 'xls', 'ppt', 'txt', 'pdf', 'docx', 'xlsx', 'pptx']

| |

isShowTip

|

是否显示提示

|

boolean (非必传)

|

true

| |

uploadFileUrl

|

上传文件的 API 方法

|

string (非必传)

|

'/admin/sys-file/upload'

| |

type

|

组件类型

|

string (非必传)

|

'default'

| |

data

|

需要额外传递给 API 的数据

|

Object (非必传)

|

| |

dir

|

子目录名称

|

String (非必传)

|

a/b 格式, v5.3+

| |

autoUpload

|

是否自动上传文件

|

boolean (非必传)

|

true

|

[](#图片上传)图片上传



`<upload-img  v-model:imageUrl="formData.avatar"  borderRadius="50%">   <template  #empty>   <el-icon><Avatar  /></el-icon>   <span>请上传头像</span>   </template>  </upload-img>`




[](#属性说明-1)属性说明

属性名称 描述 类型

imageUrl

|

图片地址 (双向绑定,上传会更新返回此字段)

|

string (必传)

| |

uploadFileUrl

|

上传图片的 API 方法

|

string (非必传)

| |

dir

|

子目录名称

|

String (非必传)

| |

drag

|

是否支持拖拽上传

|

boolean (非必传,默认为 true)

| |

disabled

|

是否禁用上传组件

|

boolean (非必传,默认为 false)

| |

fileSize

|

图片大小限制

|

number (非必传,默认为 5M)

| |

fileType

|

图片类型限制

|

File.ImageMimeType[] (非必传,默认为 ["image/jpeg", "image/png", "image/gif"])

| |

height

|

组件高度

|

string (非必传,默认为 150px)

| |

width

|

组件宽度

|

string (非必传,默认为 150px)

| |

borderRadius

|

组件边框圆角

|

string (非必传,默认为 8px)

|

[](#excel-文件上传)excel 文件上传



`<upload-excel   ref="excelUploadRef"   :title="$t('sysuser.importUserTip')"   temp-url="/admin/sys-file/local/file/user.xlsx"   url="/admin/user/import"   @refreshDataList="getDataList"  />`




[](#属性说明-2)属性说明

属性名称 描述 类型

url

|

导入文件后台接口

|

String

| |

title

|

弹出框标题

|

String

| |

tempUrl

|

获取当前导如 excel 模板地址

|

String

|

本页导航

普通文件上传

属性说明

图片上传

属性说明

excel 文件上传

属性说明