<view class="content">
<image class="logo" src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/6acec660-4f31-11eb-a16f-5b3e54966275.jpg" mode="heightFix"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
</view>
哈哈柚
- 发布：2021-11-25 21:10
- 更新：2022-02-22 21:10
- 阅读：719
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 10
HBuilderX类型： 正式
HBuilderX版本号： 3.2.16
手机系统： Android
手机系统版本号： Android 11
手机厂商： 小米
手机机型： 小米10至尊
页面类型： vue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
创建一个uni-app默认模板，修改pages/index/index.vue文件如上图代码（图片链接为image文档测试图片，仅修改image标签处内容）
创建一个uni-app默认模板，修改pages/index/index.vue文件如上图代码（图片链接为image文档测试图片，仅修改image标签处内容）
预期结果：
vue3需要正常以高固定，宽自适应展示，保证图片不能变形
vue3需要正常以高固定，宽自适应展示，保证图片不能变形
实际结果：
vue3下图片变形，外观来看是长和宽反了
vue3下图片变形，外观来看是长和宽反了
bug描述：
VUE2下image标签 mode="heightFix"显示正常，仅将manifest.json中vue版本改为3后，图片变显示异常。补充：是以 运行-> 运行到手机或模拟器 -> 在真机上展示结果
