提交 45be8f78 编写于 作者: X xiaoyucoding

fix: 修复 image 组件 mode=widthFix 不生效的问题

上级 d9d3c19e
...@@ -2,9 +2,10 @@ ...@@ -2,9 +2,10 @@
<uni-image v-on="$listeners"> <uni-image v-on="$listeners">
<div :style="modeStyle" /> <div :style="modeStyle" />
<img :src="realImagePath"> <img :src="realImagePath">
<v-uni-resize-sensor <v-uni-resize-sensor
ref="sensor" v-if="mode === 'widthFix'"
@resize="_resize" /> ref="sensor"
@resize="_resize" />
</uni-image> </uni-image>
</template> </template>
<script> <script>
...@@ -29,7 +30,8 @@ export default { ...@@ -29,7 +30,8 @@ export default {
return { return {
originalWidth: 0, originalWidth: 0,
originalHeight: 0, originalHeight: 0,
availHeight: '' availHeight: '',
sizeFixed: false
} }
}, },
computed: { computed: {
...@@ -99,12 +101,10 @@ export default { ...@@ -99,12 +101,10 @@ export default {
mode (newValue, oldValue) { mode (newValue, oldValue) {
if (oldValue === 'widthFix') { if (oldValue === 'widthFix') {
this.$el.style.height = this.availHeight this.$el.style.height = this.availHeight
this.sizeFixed = false
} }
if (newValue === 'widthFix' && this.ratio) { if (newValue === 'widthFix' && this.ratio) {
// TODO 处于不可见状态则不调整高度,暂时这样处理。 this._fixSize()
if (this._getWidth()) {
this.$el.style.height = this._getWidth() / this.ratio + 'px'
}
} }
} }
}, },
...@@ -113,6 +113,18 @@ export default { ...@@ -113,6 +113,18 @@ export default {
this._loadImage() this._loadImage()
}, },
methods: { methods: {
_resize () {
if (this.mode === 'widthFix' && !this.sizeFixed) {
this._fixSize()
}
},
_fixSize () {
const elWidth = this._getWidth()
if (elWidth) {
this.$el.style.height = elWidth / this.ratio + 'px'
this.sizeFixed = true
}
},
_loadImage () { _loadImage () {
const _self = this const _self = this
const img = new Image() const img = new Image()
...@@ -121,10 +133,7 @@ export default { ...@@ -121,10 +133,7 @@ export default {
_self.originalHeight = this.height _self.originalHeight = this.height
if (_self.mode === 'widthFix') { if (_self.mode === 'widthFix') {
// TODO 处于不可见状态则不调整高度,暂时这样处理。 _self._fixSize()
if (_self._getWidth()) {
_self.$el.style.height = _self._getWidth() / _self.ratio + 'px'
}
} }
_self.$trigger('load', $event, { _self.$trigger('load', $event, {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册