fix(components): [upload] onPreview not work when picture list ty…

…pe (#9448)
element-plus · Aug 27, 2022 · eed5763 · eed5763
1 parent ec31163
commit eed5763
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 10 deletions.
diff --git a/packages/components/upload/src/upload-list.vue b/packages/components/upload/src/upload-list.vue
@@ -33,15 +33,12 @@
           alt=""
         />
         <div
-          v-if="
-            listType !== 'picture' &&
-            (file.status === 'uploading' || listType !== 'picture-card')
-          "
+          v-if="file.status === 'uploading' || listType !== 'picture-card'"
           :class="nsUpload.be('list', 'item-info')"
         >
           <a
             :class="nsUpload.be('list', 'item-name')"
-            @click.prevent="handleClick(file)"
+            @click.prevent="handlePreview(file)"
           >
             <el-icon :class="nsIcon.m('document')"><Document /></el-icon>
             <span :class="nsUpload.be('list', 'item-file-name')">
@@ -128,7 +125,7 @@ defineOptions({
   name: 'ElUploadList',
 })
 
-const props = defineProps(uploadListProps)
+defineProps(uploadListProps)
 const emit = defineEmits(uploadListEmits)
 
 const { t } = useLocale()
@@ -138,10 +135,6 @@ const nsList = useNamespace('list')
 
 const focusing = ref(false)
 
-const handleClick = (file: UploadFile) => {
-  props.handlePreview(file)
-}
-
 const handleRemove = (file: UploadFile) => {
   emit('remove', file)
 }

diff --git a/packages/theme-chalk/src/upload.scss b/packages/theme-chalk/src/upload.scss
@@ -440,6 +440,8 @@
       box-sizing: border-box;
       margin-top: 10px;
       padding: 10px;
+      display: flex;
+      align-items: center;
 
       .#{bem('icon', '' ,'check')},
       .#{bem('icon', '' ,'circle-check')} {