有问

发布：2024-03-12 23:23
更新：2024-03-24 13:23
阅读：487

【报Bug】APP和H5平台image组件SRC数据修改后无法刷新图片

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： WIN11H22

HBuilderX类型：正式

HBuilderX版本号： 3.99

手机系统： Android

手机系统版本号： Android 13

手机厂商：荣耀

手机机型：荣耀GT40

页面类型： vue

vue版本： vue3

打包方式：云端

项目创建方式： HBuilderX

示例代码：

<image :src="bg"></image>  

<script>  
......  

data() {  
return {  
    bg:null  
   }  
}  
onLoad() {  
            let that=this;  
            that.bg=that.$comjs.api.staticUrl+'image/map1/bg.jpg'  

}

操作步骤：

测试image图片组件src修改无效。APP和H5端都不行。小程序中正常。

预期结果：

图片组件中的src在方法中修改后，图片应该刷新。

实际结果：

图片组件中的src在方法中修改后，图片没有刷新。APP和H5中有这个问题。
小程序中正常。

bug描述：

未使用setup。image图片组件src数据修改后，模板中的数据不更新。小程序中正常。APP和H5中都不能自动更新修改后的数据。初始化的数据是正常的。文本也可以改变。就是图片SRC地址虽然改变了，但图片组件并未刷新。

2024-03-12 23:23 负责人:HRK_01 分享

12 个回复

有问 (作者) - 生活，趣与失。

使用setup也不行。APP和H5中都无法修改data的变量值。什么情况？
用A版HBX也不行。
调试新值已改变，但是数据无变化。

有问 (作者) - 生活，趣与失。

测试文本数据可以刷新。小程序中图片src改变后图片组件也能自动刷新。
只有APP和H5中图片更新后不会刷新。首次赋值正常。
图片是网络地址

YUANRJ

请提供下测试工程

有问 (作者)

之前的老项目了，也是用VUE3写的。提供太麻烦了，还有很多模块要剔除。不行我再看看吧。反正小程序是正常的。新建的项目未测试。

2024-03-13 12:25

有问 (作者) - 生活，趣与失。

宽设置720，高设置100%，或高设置auto时，都无法显示图片，如果不设置auto，图片就变形。
小程序中正常。
外层用的CSS样式relative
图片组件未使用其它绝对或悬浮样式。
内置浏览器也没事。谷歌浏览器出现问题。APP出现问题。

BeardYound

data的bg设置为空字符串
打印下面的that.bg
在上面的image加v-if=“bg”

有问 (作者)

这个也不行。以前没毛病，这次大更新完才发现有这个问题。

2024-03-13 22:03

BeardYound

如果想高度自适应就在image加mode=“widthFix”，如果想宽度自适应就加mode=“heightFix”，css只需要加对应的宽度或者高度即可，其它元素都不要

有问 (作者)

主要是我要从服务器上同步部分样式元素数据下来，要是每个元素都加判断是否空才加入也麻烦。

2024-03-13 22:03

BeardYound

app和h5是做语法验证的，相对小程序比较严格,(小程序其实帮你处理了对应的错误)，假设

在页面使用某一个字段，这个字段在data是不存在的，这个时候app和h5就会报错，小程序却不会报错
你这个bg:null就是一个异常数据

锦鲤丶接单丶 - 锦鲤丶接单丶18560000860丶10+年开发经验

查找一下是否有其他地方也更新src字段的值了

有问 (作者)

没有。正常的。在小程序中是没有问题的。以前的版本在APP上也没问题。这次更新完，发现APP安卓13首次启动，数据加载慢了NN秒，模拟器9上面却很快。

2024-03-13 22:04

有问 (作者) - 生活，趣与失。

但是之前是没有问题的。
而且我又研究了一下，H5上面现在UNIAPP正在向UNIAPP-X转换，我发现它自动在上层加了background-image做背景图，而下面还有一层是<img，不知道这样做的用意是什么。
另外我在浏览中直接修改样式height:auto，图片没有问题。
但是我在元素中动态修改样式，样式从服务器上同步下来的auto，就出现了问题。如下图：
<image :src=xxxxxx :style="{width:netWidth,height:netHeight}"
然后POST从后台出来的数据，把netHeight变成auto，在H5和APP中显示就不显示图片了。

PS:
还有一个情况就是，新版本更新后，APP首次启动慢了N倍。。。安卓13真机测试是这样，测试多个品牌的手机都出现了这个问题。而以前打包的没有这个问题，且安卓模拟器9上面也很快。

锦鲤丶接单丶 - 锦鲤丶接单丶18560000860丶10+年开发经验

<image>组件高度设置为auto就会塌陷为0，一直有这个问题，你把image的mode设置成widthFix不就行了

HRK_01

你确定你的图片地址是对的吗？我这边测试了一下是可以正常展示的，有没有可能是跨域的问题？H5有相关报错的字眼吗？控制台里有没有报错什么的

<template>  
    <view class="main">  
        <image :src="src" mode=""></image>  
        <!-- <input type="digit" v-model="num"/> -->  
    </view>  
</template>  
<script>  
    export default {  
        data() {  
            return {  
                num: 1,  
                src: ''  
            }  
        },  
        onLoad() {  
            setTimeout(() => {  
                this.src = '../../static/logo.png';  
            }, 10000)  
        }  
    }  
</script>

有问 (作者) - 生活，趣与失。

个别的有这个问题。去年创建的项目，图片地址绝对正确，就是动态更换换不了。小程序中就正常。其它的我再看看吧。

HRK_01

动态更新后，打印出来的图片地址是正常的吗

2024-03-25 09:42
有问 (作者)

回复 HRK_01: 是的。就是我那个去年做的项目有问题，小程序里就是正常的，到APP和H5上就没问题，算了，我新建了项目。

2024-03-29 17:50

要回复问题请先登录或注册

【报Bug】APP和H5平台image组件SRC数据修改后无法刷新图片

示例代码：

`<image :src="bg"></image> <script> ...... data() { return { bg:null } } onLoad() { let that=this; that.bg=that.$comjs.api.staticUrl+'image/map1/bg.jpg' }`

操作步骤：

测试image图片组件src修改无效。APP和H5端都不行。小程序中正常。

预期结果：

图片组件中的src在方法中修改后，图片应该刷新。

实际结果：

图片组件中的src在方法中修改后，图片没有刷新。APP和H5中有这个问题。
小程序中正常。

bug描述：

12 个回复

公告

相关问题

【报Bug】APP和H5平台image组件SRC数据修改后无法刷新图片

示例代码： <image :src="bg"></image> <script> ...... data() { return { bg:null } } onLoad() { let that=this; that.bg=that.$comjs.api.staticUrl+'image/map1/bg.jpg' }

操作步骤： 测试image图片组件src修改无效。APP和H5端都不行。小程序中正常。

预期结果： 图片组件中的src在方法中修改后，图片应该刷新。

实际结果： 图片组件中的src在方法中修改后，图片没有刷新。APP和H5中有这个问题。 小程序中正常。

bug描述：

与内容相关的链接

12 个回复

公告

相关问题

示例代码：

`<image :src="bg"></image> <script> ...... data() { return { bg:null } } onLoad() { let that=this; that.bg=that.$comjs.api.staticUrl+'image/map1/bg.jpg' }`

操作步骤：

测试image图片组件src修改无效。APP和H5端都不行。小程序中正常。

预期结果：

图片组件中的src在方法中修改后，图片应该刷新。

实际结果：

图片组件中的src在方法中修改后，图片没有刷新。APP和H5中有这个问题。
小程序中正常。