旧时光
旧时光
  • 发布:2023-07-18 10:42
  • 更新:2023-07-18 18:06
  • 阅读:256

【报Bug】自定义底部tabbar,图标是gif图时,gif图有时无法正常播放动画,或者动画不全

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win10 64位

HBuilderX类型: 正式

HBuilderX版本号: 3.8.7

手机系统: Android

手机系统版本号: Android 12

手机厂商: 华为

手机机型: mate30 Pro

页面类型: vue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

操作步骤:
  1. 安卓真机运行项目(上面的代码:gif图bug.rar请解压直接运行到真机);
  2. 打开项目由首页切换到商品页面,等商品下面的gif图标动画播放完成再切换到首页,发现首页gif无动画了,只有快速来回切换动画正常;

预期结果:

gif动画可以正常播放

实际结果:

gif动画快速切换无法正常播放

bug描述:

由于项目有多套主题风格,框架自带底部tabbar无法满足需要,故选择自定义底部tabbar。但是gif图片,快速来回切换动画正常,如果打开项目由首页切换到商品页面,等商品下面的gif图标动画播放完成再切换到首页,发现首页gif无动画了;

2023-07-18 10:42 负责人:DCloud_App_Array 分享
已邀请:
喜欢技术的前端

喜欢技术的前端 - QQ---445849201

切换的时候给gif路径后面拼接 时间戳,让重新加载试试

`../static/test.gif?${new Date().getTime()}`
  • 旧时光 (作者)

    感谢大佬的回复,你这个方法我也百度到啦,可以让其重新加载,达到动画重新执行的目的,但是不知道为啥tabbar需要第二次点击才有gif动画

    2023-07-18 14:31

  • 喜欢技术的前端

    回复 旧时光: 是直接用<img/> 标签的吧,不是<image/>

    2023-07-18 17:47

  • 旧时光 (作者)

    回复 喜欢技术的前端: <img/> 标签 在app端不支持的

    2023-07-18 18:04

旧时光

旧时光 (作者) - 我是一位5年+前端开发的技术人员

问题已解决:解决方案把barlist数据放在vuex里面,currentIndex也放vuex共享,切换的时候this.$store.commit("setCurrentIndex", index); 需要把所有数据都放vuex共享,不能让组件加载一次都创建一份新的数据。

要回复问题请先登录注册