uniapp の異なるサイズの画像が同じビューに同じサイズで表示される方法

     実際の作業では、画像処理の問題に遭遇することがよくあります.サーバー上の同じインターフェイスによって返される複数の画像のサイズは異なる場合があります.この記事では、ページがレンダリングされたときに画像の表示サイズを一定に保つ方法について、独自のアプローチについて説明します.最も
     簡単な解決策は、イメージをラップするビューのサイズをイメージ内のサイズと一致させることです。実装は次のとおりです

.image_class{
    
    
      width: 280rpx;
   		height: 160rpx;
   		image{
    
    
        width: 280rpx;
        height: 160rpx;
   		}
  }

テンプレートでは:

	<view>
	<view class="image_class" v-if="item in imgList" :key=item.id>
       <image :src="item.imageUrl" ></image>
     </view>
	</view>


ここに画像の説明を挿入
     イメージ タグで高さと幅の比率を 100% に設定しても機能しないことに注意してください。同じ問題が発生することを期待して、記録するだけです

おすすめ

転載: blog.csdn.net/weixin_43401380/article/details/128709792