github/basic
1
0
Fork 1
mirror of https://github.com/fantastic-admin/basic.git synced 2026-10-07 05:44:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

优化image-preview组件

Browse Source
This commit is contained in:
hooray
2021-01-04 09:52:59 +08:00
parent d02e278362
commit 36a673a010
2 changed files with 12 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ImagePreview/index.vue
+6 -7
View File
@@ -1,11 +1,9 @@
<template>
<div>
<el-image class="img" :src="src" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="[src]">
<div slot="error" class="image-slot">
<svg-icon name="image-load-fail" />
</div>
</el-image>
</div>
<el-image :src="src" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="[src]">
<div slot="error" class="image-slot">
<svg-icon name="image-load-fail" />
</div>
</el-image>
</template>
<script>
@@ -48,6 +46,7 @@ export default {
.el-image {
border-radius: 5px;
background-color: #ebeef5;
box-shadow: 0 0 5px 1px #ccc;
::v-deep .el-image__inner {
transition: all 0.3s;
cursor: pointer;
src/views/component_example/image.preview.vue
+6 -2
View File
@@ -2,8 +2,12 @@
<div>
<page-header title="图片预览" content="ImagePreview" />
<page-main>
<image-preview src="https://s1.ax1x.com/2020/07/03/NOeqld.jpg" :width="200" />
<image-preview src="" width="100px" height="100px" />
<div>
<image-preview src="https://s1.ax1x.com/2020/07/03/NOeqld.jpg" :width="200" />
</div>
<div>
<image-preview src="" width="100px" height="100px" />
</div>
</page-main>
</div>
</template>