app.json文件配置信息
"tabBar": { "color":"#000",//基础底部图标颜色 "selectedColor": "#f4ea2a",//选中图标颜色 "borderStyle": "white",//底部颜色 "list": [ { "pagePath": "pages/index/index", "text": "首页", "iconPath": "images/home.png",//未选中图标 "selectedIconPath": "images/homei.png"//选中图标 }, { "pagePath": "pages/INcircle/INcircle", "text": "交流圈", "iconPath": "images/circle.png", "selectedIconPath": "images/circlei.png" }, { "pagePath": "pages/INTimetable/INTimetable", "text": "课表", "iconPath": "images/Timetable.png", "selectedIconPath": "images/Timetablei.png" }, { "pagePath": "pages/INMy/INMy", "text": "我的", "iconPath": "images/My.png", "selectedIconPath": "images/Myi.png" } ] }, "networkTimeout": { "request": 10000, "downloadFile": 10000 }小红点配置: 不带文字 wx.showTabBar(OBJECT) wx.hideTabBar(OBJECT) 带文字:wx.setTabBarBadge(OBJECT) wx.removeTabBarBadge(OBJECT) 具体看微信官方文档:微信底部栏角标小红点配置
闪烁角标小红点配置index.jsdome:
Page({ data: { countDownNum: 3, i: 123, }, //设置定时器角标显示闪烁 countDown: function () { var that = this, countDownNum = that.data.countDownNum if (that.data.i != null) { that.setData({ timer: setInterval(function () { countDownNum--; console.log(countDownNum) //当countDownNum为偶数时显示红点 //当countDownNum为奇数时隐藏红点 if (countDownNum % 2 == 0) { wx.setTabBarBadge({ index: 2,//index是让tabbar的第几个图标闪起来(从0开始的),我现在是让第二个图片的红点闪 text:"12" }) } else { wx.removeTabBarBadge({ index: 2,//index是让tabbar的第几个图标闪起来(从0开始的),我现在是让第二个图片的红点闪 text:"12" }) } if (countDownNum == 0) { clearInterval(that.data.timer);//让计时器取消定时 } }, 1000)//这里的单位是毫秒,是计时器在倒数时的间隔时间,如果想把闪烁速度调快,把这里的数值调低 }) } }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { //方法调用 this.countDown(); } })