uni-app uni.setTabBarItem 动态设置text时 IOS端文字不会改变 改变icon有效

uni-app uni.setTabBarItem 动态设置text时 IOS端文字不会改变 改变icon有效

开发环境 版本号 项目创建方式
Mac macOS Catalina HBuilderX

示例代码:

uni.setTabBarItem({
"index": 0,
"pagePath": "pages/index/index",
"iconPath": "static/images/home.png",
"selectedIconPath": "static/images/home_sel.png",
"text": "首页"
})  

操作步骤:

uni.setTabBarItem({
"index": 0,
"pagePath": "pages/index/index",
"iconPath": "static/images/home.png",
"selectedIconPath": "static/images/home_sel.png",
"text": "首页"
})  

预期结果:

  • 可以正常修改text

实际结果:

  • 无法正常修改text

bug描述:

  • 在使用uni.setTabBarItem方法修改tabbaritem的text时,iOS端无法正常修改文字

更多关于uni-app uni.setTabBarItem 动态设置text时 IOS端文字不会改变 改变icon有效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

测试未复现 提供一个能复现的示例工程吧

更多关于uni-app uni.setTabBarItem 动态设置text时 IOS端文字不会改变 改变icon有效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


刚才创建了一个Dome,无法复现当前问题,但是原项目中仍然有问题,请问这个可能跟所要修改的page是nvue有关吗?

问题已解决,是跟语言国际化冲突导致的

在 uni-app 中使用 uni.setTabBarItem 动态设置 TabBar 的 text 时,如果在 iOS 端文字没有改变,但 icon 有效,这可能是由于 iOS 端的渲染机制或某些缓存问题导致的。以下是一些可能的解决方案:

1. 强制刷新 TabBar

尝试在设置 text 后,强制刷新 TabBar。可以通过设置一个不相关的属性来触发刷新,例如:

uni.setTabBarItem({
  index: 0,
  text: '新文字',
  success: () => {
    // 强制刷新 TabBar
    uni.setTabBarItem({
      index: 0,
      text: '新文字',
      iconPath: '/static/icon.png' // 设置一个不相关的属性
    });
  }
});

2. 使用 uni.setTabBarStyle

尝试通过 uni.setTabBarStyle 来设置 TabBar 的样式,可能会触发 TabBar 的重新渲染:

uni.setTabBarItem({
  index: 0,
  text: '新文字',
  success: () => {
    // 强制刷新 TabBar 样式
    uni.setTabBarStyle({
      color: '#000000',
      selectedColor: '#FF0000'
    });
  }
});

3. 使用 uni.hideTabBaruni.showTabBar

尝试先隐藏 TabBar,然后再显示它,以触发重新渲染:

uni.setTabBarItem({
  index: 0,
  text: '新文字',
  success: () => {
    uni.hideTabBar({
      animation: false,
      success: () => {
        uni.showTabBar({
          animation: false
        });
      }
    });
  }
});

4. 检查代码逻辑

确保在设置 text 时,代码逻辑没有问题,例如 index 是否正确,text 是否被正确传递等。

5. 更新 uni-app 版本

确保你使用的是最新版本的 uni-app,因为旧版本可能存在一些已知的 bug,新版本可能已经修复了这些问题。

6. 使用 uni.reLaunchuni.switchTab

如果以上方法都不奏效,可以尝试使用 uni.reLaunchuni.switchTab 重新加载页面,以强制刷新 TabBar:

uni.setTabBarItem({
  index: 0,
  text: '新文字',
  success: () => {
    uni.switchTab({
      url: '/pages/index/index' // 切换到当前页面
    });
  }
});

7. 使用 uni.setNavigationBarTitle

如果只是需要改变某个页面的标题,可以考虑使用 uni.setNavigationBarTitle 来设置导航栏标题,而不是 TabBar 的 text

uni.setNavigationBarTitle({
  title: '新标题'
});
回到顶部