Commit 30fa9218 authored by chris.yang's avatar chris.yang

feat:Normaimage

parent d14e396f
<template> <template>
<view class="normal-image"> <view class="normal-image">
<!-- <BasicText :elementInfo="elementInfo"></BasicText> -->
<NormalTitle :elementInfo="elementInfo"></NormalTitle> <NormalTitle :elementInfo="elementInfo"></NormalTitle>
<u-empty <u-empty v-if="!elementInfo.option.images.list.length"></u-empty>
v-if="!elementInfo.option.images.list.length"></u-empty> <u-image class="uimage" v-if="elementInfo.option.images.list.length === 1" width="100%" :height="imageHeight"
<u-image class="uimage"
v-if="elementInfo.option.images.list.length === 1"
width="100%"
:height="imageHeight"
:src="elementInfo.option.images.list[0].url"> :src="elementInfo.option.images.list[0].url">
</u-image> </u-image>
<u-swiper <u-swiper v-if="elementInfo.option.images.list.length > 1" mode="dot"
v-if="elementInfo.option.images.list.length > 1" :autoplay="elementInfo.option.images.autoplay" :interval="elementInfo.option.images.autoplaySpeed * 1000"
mode="dot" :indicator="elementInfo.option.images.dots" :list="elementInfo.option.images.list" width="100%"
:autoplay="elementInfo.optison.images.autoplay" height="100%" name="url">
:interval="elementInfo.option.images.autoplaySpeed * 1000"
:indicator="elementInfo.option.images.dots"
:list="elementInfo.option.images.list"
width="100%"
:height="imageHeight"
name="url">
</u-swiper> </u-swiper>
</view> </view>
</template> </template>
...@@ -32,23 +21,6 @@ ...@@ -32,23 +21,6 @@
type: Object, type: Object,
required: true required: true
} }
},
data() {
return {
windowWidth: 0, //屏幕宽度
imageHeight:0 //图片高度
};
},
mounted() {
uni.getSystemInfo({
success: res=> {
this.windowWidth = res.windowWidth;
this.imageHeight = (this.windowWidth*this.elementInfo.height)/this.elementInfo.width;
}
});
},
onLoad() {
} }
} }
</script> </script>
...@@ -57,13 +29,13 @@ ...@@ -57,13 +29,13 @@
.normal-image { .normal-image {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
}
.uimage {
max-width: 100%;
max-height: 100%;
object-fit: contain;
} }
.uimage {
width: 100%;
height: 100%;
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment