From cc9b67d4676dd51a6b2d88e92607aca2629ee54d Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期五, 22 十二月 2023 13:26:26 +0800 Subject: [PATCH] !72 发布 vue 版本 5.1.2 与 cloud 版本 2.1.2 Merge pull request !72 from 疯狂的狮子Li/temp --- src/components/ImagePreview/index.vue | 32 +++++++++++++++++--------------- 1 files changed, 17 insertions(+), 15 deletions(-) diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue index 9b244f8..723ccdb 100644 --- a/src/components/ImagePreview/index.vue +++ b/src/components/ImagePreview/index.vue @@ -1,9 +1,18 @@ +<template> + <el-image :src="`${realSrc}`" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="realSrcList" preview-teleported> + <template #error> + <div class="image-slot"> + <el-icon><picture-filled /></el-icon> + </div> + </template> + </el-image> +</template> + <script setup lang="ts"> +import { propTypes } from '@/utils/propTypes'; + const props = defineProps({ - src: { - type: String, - default: "" - }, + src: propTypes.string.def(''), width: { type: [Number, String], default: "" @@ -27,7 +36,7 @@ return; } let real_src_list = props.src.split(","); - let srcList:string[] = []; + let srcList: string[] = []; real_src_list.forEach(item => { return srcList.push(item); }); @@ -43,28 +52,21 @@ ); </script> -<template> - <el-image :src="`${realSrc}`" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="realSrcList" preview-teleported> - <template #error> - <div class="image-slot"> - <el-icon><picture-filled /></el-icon> - </div> - </template> - </el-image> -</template> - <style lang="scss" scoped> .el-image { border-radius: 5px; background-color: #ebeef5; box-shadow: 0 0 5px 1px #ccc; + :deep(.el-image__inner) { transition: all 0.3s; cursor: pointer; + &:hover { transform: scale(1.2); } } + :deep(.image-slot) { display: flex; justify-content: center; -- Gitblit v1.9.3