<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后,图片变显示异常。补充:是以 运行-> 运行到手机或模拟器 -> 在真机上展示结果

