7***@qq.com
7***@qq.com
  • 发布:2023-07-21 17:52
  • 更新:2024-11-10 22:26
  • 阅读:284

【报Bug】nvue 安卓 image mode="aspectFit" 空白部分显示异常

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: 17

HBuilderX类型: 正式

HBuilderX版本号: 3.8.11

手机系统: Android

手机系统版本号: Android 14

手机厂商: 小米

手机机型: 小米8

页面类型: nvue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

<template>
<view style="border: 1px solid green">
<image
src="https://images.bytiyu.net/uploads/im/20230721/202307211317255686712.jpg"
mode="aspectFit"
style="height: 250px; border: 1px solid red; border-radius: 20rpx"
/>
</view>
</template>

<script>
export default {
name: "",
data() {
return {};
},
created() {},
methods: {}
};
</script>

<style lang='scss' scoped>
</style>

操作步骤:

代码跑一下就知道了

预期结果:

拉伸去掉

实际结果:

空白部分变成了拉伸

bug描述:

按桌。nvue 中 image 组件,mode = aspectFit, 再给style加border-radius,会导致异常拉伸。

2023-07-21 17:52 负责人:DCloud_App_Array 分享
已邀请:
爱豆豆

爱豆豆 - 办法总比困难多

没有复现你的这个问题 你能提供一个demo吗?我来测试一下

y***@yuexiang365.cn

y***@yuexiang365.cn

请问解决了吗

syczuan

syczuan

安卓端image设置 border-radius,mode="aspectFit" ,两边在容器中显示就会出现图片异常,ios端没问题,hbuilder x 版本4.24.2024072208也会出现

2***@qq.com

2***@qq.com

我也遇到了,我说咋回事,被模糊拉伸,确实是对image 设置圆角,就会出现

要回复问题请先登录注册