小程序
小游戏
企业微信
微信支付
扫描小程序码分享
- 当前 Bug 的表现（可附上截图）
- 预期表现
- 复现路径
- 提供一个最简复现 Demo
在非TabBar页面执行
setTabBarBadge方法不起作用，如何在子页面更新一级页面上的Badge信息？
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
结合上面兄弟的分享，我写了目前在用的方法：
app.js
_showBadge:
function
(num, show) {
if
(show == 0) {
wx.removeTabBarBadge({ index: 3 });
}
else
{
wx.setTabBarBadge({
index: 3,
text: String(num),
});
},
// 微章闪动
_flashingBadge:
(num) {
var
that =
this
;
// 隐藏微章 显示微章 * 3
that._showBadge(num, 0);
setTimeout(
() {
that._showBadge(num, 1);
}, 150);
}, 300);
}, 400);
}, 480);
}, 580);
_clearBadgeTimer:
(that.globalData._setTabBarBadgeTimer) {
clearInterval(that.globalData._setTabBarBadgeTimer);
that.globalData._setTabBarBadgeTimer =
null
_createBadgeTimer:
return
that.globalData._setTabBarBadgeTimer = setInterval(
that.setMsgBadge(that.globalData.badgeNum);
// 设置消息微章
setMsgBadge:
(num == 0) {
that.globalData.badgeNum = 0;
wx.setStorageSync(
'badgeNum'
, 0);
wx.removeTabBarBadge({
success:
that._clearBadgeTimer();
fail:
// 不在tab 页设置会失败 失败就启动定时器 来不断重试，直至成功，这样再回到tab页就不会出现 “Badge未同步” 的问题了
console.log(
'wx.removeTabBarBadge fail'
);
that._createBadgeTimer();
(num > that.globalData.badgeNum) {
wx.vibrateLong();
// 小震动
wx.playBackgroundAudio({
dataUrl:
'https://x.aipin100.cn/static/newMessage.aac'
,
that._flashingBadge(num);
// 闪动
that.globalData.badgeNum = num;
, num);
'wx.setTabBarBadge fail'
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
这个就是耗点页面性能，用户手机费点电，但应该不会影响很大吧
我是把 TabBarBadge 的状态存在全局上，每次进入 TabBar 页面时，用 onShow 检测更新
那样每个TabBar 页面都要写代码，很不好
我直接用setInterval
clearTimer =
clearInterval(app.globalData.setTabBarBadgeTimer);
app.globalData.setTabBarBadgeTimer =
};
(app.globalData.setTabBarBadgeTimer){
clearTimer();
app.globalData.setTabBarBadgeTimer=setInterval(
(){
(app.globalData.unreadCount > 0){
index: 2,
text: app.globalData.unreadCount.toString(),
() { clearTimer(); }
},300);
写在一个commonJs中，用的时候调用一下，300毫秒循环去，直到success退出
success
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
结合上面兄弟的分享，我写了目前在用的方法：
app.js
_showBadge:function(num, show) {if(show == 0) {wx.removeTabBarBadge({ index: 3 });}else{wx.setTabBarBadge({index: 3,text: String(num),});}},// 微章闪动_flashingBadge:function(num) {varthat =this;// 隐藏微章 显示微章 * 3that._showBadge(num, 0);setTimeout(function() {that._showBadge(num, 1);}, 150);setTimeout(function() {that._showBadge(num, 0);}, 300);setTimeout(function() {that._showBadge(num, 1);}, 400);setTimeout(function() {that._showBadge(num, 0);}, 480);setTimeout(function() {that._showBadge(num, 1);}, 580);},_clearBadgeTimer:function() {varthat =this;if(that.globalData._setTabBarBadgeTimer) {clearInterval(that.globalData._setTabBarBadgeTimer);that.globalData._setTabBarBadgeTimer =null;}},_createBadgeTimer:function() {varthat =this;if(that.globalData._setTabBarBadgeTimer) {return;}else{that.globalData._setTabBarBadgeTimer = setInterval(function() {that.setMsgBadge(that.globalData.badgeNum);}, 300);}},// 设置消息微章setMsgBadge:function(num) {varthat =this;if(num == 0) {that.globalData.badgeNum = 0;wx.setStorageSync('badgeNum', 0);wx.removeTabBarBadge({index: 3,success:function() {that._clearBadgeTimer();},fail:function() {// 不在tab 页设置会失败 失败就启动定时器 来不断重试，直至成功，这样再回到tab页就不会出现 “Badge未同步” 的问题了console.log('wx.removeTabBarBadge fail');that._createBadgeTimer();},});return;}if(num > that.globalData.badgeNum) {wx.vibrateLong();// 小震动wx.playBackgroundAudio({dataUrl:'https://x.aipin100.cn/static/newMessage.aac',});that._flashingBadge(num);// 闪动}that.globalData.badgeNum = num;wx.setStorageSync('badgeNum', num);wx.setTabBarBadge({index: 3,text: String(num),success:function() {that._clearBadgeTimer();},fail:function() {// 不在tab 页设置会失败 失败就启动定时器 来不断重试，直至成功，这样再回到tab页就不会出现 “Badge未同步” 的问题了console.log('wx.setTabBarBadge fail');that._createBadgeTimer();},});},这个就是耗点页面性能，用户手机费点电，但应该不会影响很大吧
我是把 TabBarBadge 的状态存在全局上，每次进入 TabBar 页面时，用 onShow 检测更新
那样每个TabBar 页面都要写代码，很不好
我直接用setInterval
varclearTimer =function() {clearInterval(app.globalData.setTabBarBadgeTimer);app.globalData.setTabBarBadgeTimer =null;};if(app.globalData.setTabBarBadgeTimer){clearTimer();}else{app.globalData.setTabBarBadgeTimer=setInterval(function(){if(app.globalData.unreadCount > 0){wx.setTabBarBadge({index: 2,text: app.globalData.unreadCount.toString(),success:function() { clearTimer(); }});}else{wx.removeTabBarBadge({index: 2,success:function() { clearTimer(); }});}},300);}写在一个commonJs中，用的时候调用一下，300毫秒循环去，直到
success退出