weex - 如何在加载网络图像后动态更改图像视图高度而不是固定图像高度？

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

只需使用加载事件。例如：

<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>