为了封装一个el-upload组件,你可以按照以下步骤进行: 创建一个Vue3组件: 首先,创建一个新的Vue3组件文件,比如命名为CustomUpload.vue。 在组件中引入并使用el-upload组件: 在CustomUpload.vue中,你需要引入Element Plus库中的el-upload组件。你可以通过全局引入Element Plus库,或者在单个组件中局部引入el-upload。
vue3全局引入组件 在mian.ts中 importcompressUploadfrom'/@/views/common/component/compressUpload/index.vue'*** ***constapp =createApp(App)// 封装el-upload,主要是自定义上传函数,在上传时提前压缩app.component('compressUpload', compressUpload) 具体页面中的使用 直接把 <el-upload></el-upload> 改为...
<el-upload:before-update="handleBeforeUpdate" :http-request="uploadFile"> // 自定义上传组件样式 </el-upload> // 上传前的文件校验 function handleBeforeUpload(file: UploadRawFile) { const inType = /.(jpg|jpeg|png|JPG|PNG|JPEG)$/gi.test(file.name); if (!inType) { ElMessage.warning("...
在Vue3项目中,如果我们想上传图片一般可以利用element-ui中的el-upload,为了避免代码的重复,我们可以自己封装一个图片上传组件。