| | |
| | | <script setup lang="ts"> |
| | | const props = defineProps({ |
| | | src: { |
| | | type: String, |
| | | default: "" |
| | | }, |
| | | width: { |
| | | type: [Number, String], |
| | | default: "" |
| | | }, |
| | | height: { |
| | | type: [Number, String], |
| | | default: "" |
| | | } |
| | | }); |
| | | |
| | | const realSrc = computed(() => { |
| | | if (!props.src) { |
| | | return; |
| | | } |
| | | let real_src = props.src.split(",")[0]; |
| | | return real_src; |
| | | }); |
| | | |
| | | const realSrcList = computed(() => { |
| | | if (!props.src) { |
| | | return; |
| | | } |
| | | let real_src_list = props.src.split(","); |
| | | let srcList:string[] = []; |
| | | real_src_list.forEach(item => { |
| | | return srcList.push(item); |
| | | }); |
| | | return srcList; |
| | | }); |
| | | |
| | | const realWidth = computed(() => |
| | | typeof props.width == "string" ? props.width : `${props.width}px` |
| | | ); |
| | | |
| | | const realHeight = computed(() => |
| | | typeof props.height == "string" ? props.height : `${props.height}px` |
| | | ); |
| | | </script> |
| | | |
| | | <template> |
| | | <el-image :src="`${realSrc}`" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="realSrcList" preview-teleported> |
| | | <template #error> |
| | |
| | | </el-image> |
| | | </template> |
| | | |
| | | <script setup lang="ts"> |
| | | const props = defineProps({ |
| | | src: { |
| | | type: String, |
| | | default: "" |
| | | }, |
| | | width: { |
| | | type: [Number, String], |
| | | default: "" |
| | | }, |
| | | height: { |
| | | type: [Number, String], |
| | | default: "" |
| | | } |
| | | }); |
| | | |
| | | const realSrc = computed(() => { |
| | | if (!props.src) { |
| | | return; |
| | | } |
| | | let real_src = props.src.split(",")[0]; |
| | | return real_src; |
| | | }); |
| | | |
| | | const realSrcList = computed(() => { |
| | | if (!props.src) { |
| | | return; |
| | | } |
| | | let real_src_list = props.src.split(","); |
| | | let srcList:string[] = []; |
| | | real_src_list.forEach(item => { |
| | | return srcList.push(item); |
| | | }); |
| | | return srcList; |
| | | }); |
| | | |
| | | const realWidth = computed(() => |
| | | typeof props.width == "string" ? props.width : `${props.width}px` |
| | | ); |
| | | |
| | | const realHeight = computed(() => |
| | | typeof props.height == "string" ? props.height : `${props.height}px` |
| | | ); |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .el-image { |
| | | border-radius: 5px; |