From 35c30ecf074b292e955d96df7a713a2166daff0e Mon Sep 17 00:00:00 2001 From: luobisheng <727299681@qq.com> Date: 星期二, 22 十一月 2022 18:32:06 +0800 Subject: [PATCH] 上传处置结果处理 --- src/components/myUpload/index.vue | 43 ++++++++++++++++++++++--------------------- 1 files changed, 22 insertions(+), 21 deletions(-) diff --git a/src/components/myUpload/index.vue b/src/components/myUpload/index.vue index c5930f0..a7f4acb 100644 --- a/src/components/myUpload/index.vue +++ b/src/components/myUpload/index.vue @@ -1,9 +1,8 @@ <template> <div class="my-upload"> - <el-upload + <el-upload :file-list="fileList" - class="upload-demo" - action="/sccg/file/medias" + action="/sccg/file/medias" :multiple="multiple" :show-file-list="flag" :before-upload="beforeUpload" @@ -13,9 +12,9 @@ :list-type="listType" :on-remove="handleRemove" :headers="getToken()"> - <div class="upload-btn" :style="{'height':btnHeight,'width':btnWidth}"> - <i class="el-icon-plus"></i> - <span>涓婁紶鍥剧墖</span> + <div class="upload-btn"> + <i class="el-icon-plus"></i> + <span>涓婁紶鍥剧墖</span> </div> </el-upload> </div> @@ -32,10 +31,6 @@ multiple: false, // 闄愬埗 limit: 4, - // 鎸夐挳楂樺害 - btnHeight: '100px', - // 鎸夐挳瀹藉害 - btnWidth: '100px', // 鏂囦欢鍒楄〃绫诲瀷 listType: 'picture-card' }; @@ -69,7 +64,6 @@ }, // 涓婁紶澶辫触鍥炶皟 handleError(err, file, fileList) { - console.log(err); this.$message({ type:'error', message:err @@ -82,10 +76,6 @@ if (token && tokenHead) { return { Authorization: tokenHead + token } } - }, - // 棰勮 - handlePreview(file){ - console.log(file) }, // 绉婚櫎鏂囦欢 handleRemove(file, fileList){ @@ -101,15 +91,16 @@ delPictureUrl:{ type:Function, default:()=>{} - } - } + }, + pictureList: { + type: Array, + default: () => [] + } + }, } </script> <style lang="scss" scoped> .my-upload { - .upload-demo { - display: flex; - } :deep(.el-upload--picture-card) { width: 100px; @@ -119,13 +110,18 @@ width: 100px; height: 100px; } + //.file-list { + // display: flex; + // flex-wrap: nowrap; + //} .upload-btn { - // background-color: rgba(249, 249, 249, 1); display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 4px; + width: 100px; + height: 100px; &:hover i{ color: #409eff; @@ -140,5 +136,10 @@ line-height: 22px; } } + .uploaded-image { + width: 0; + height: 100px; + display: flex; + } } </style> \ No newline at end of file -- Gitblit v1.8.0