Question

<div>
  <image style="width: 280px;height: 280px;margin-left:250px;margin-top:100px" :src="picPath"></image>
</div>

在上面的foo.vue中，它指定了图像的宽度和高度，但在某些情况下，我们需要在图像加载到imageview后更改图像的宽度和高度。我的问题是，为了那个，我应该怎么做从foo.vue到本机android / ios？提前谢谢。

Answer 1

只使用load事件。 e.g：

<template>
    <div style="width: 750px; background-color: #f4f4f4; margin-top: 10px;" v-for="(item, index) in storyJson">
      <image v-if="item.type === 'image'" :src="item.value" style="width: 750px; height: 468px; margin-bottom: 10px;" @load="load" resize="contain"></image>
    </div>
</template>

<script>
module.exports = {
  props: {
    storyJson: {
      default: function () {
        return [];
      }
    }
  },
  methods: {
    setUpStoryJson(json) {
      this.storyJson = JSON.parse(json);
    },
    load(e) {
      const naturalSize = e.size;
      const showHeight = naturalSize.naturalHeight * 750 / naturalSize.naturalWidth;
      e.target.setStyle('height', showHeight + 'px');
    }
  }
};</script>

如何在加载网络图像后动态更改图像视图高度，而不是修复图像高度？

1 个答案: