<!--pages/index1/index1.wxml-->
<button bindtap="btnClick1" size="default" type="primary">显示 tabBar 的页面1的右上角的红点</button>
<button bindtap="btnClick2" type="default">隐藏 tabBar 的页面1的右上角的红点</button>
<button bindtap="btnClick3" type="primary">为 tabBar 右上角添加文本</button>
<button bindtap="btnClick4" type="warn">移除 tabBar 右上角的文本</button>
<button bindtap="btnClick5" type="primary">隐藏 tabBar</button>
<button bindtap="btnClick6" type="warn">显示 tabBar</button>
<button bindtap="btnClick7" type="primary">动态改变 tabBar 内容</button>
<button bindtap="btnClick8" type="default">动态改变 tabBar 图标文字颜色</button>
/**
wx.showTabBarRedDot 显示tabBar 某一项的右上角的红点
index:0 abBar 的哪一项,从左边算起
wx.hideTabBarRedDot 显示tabBar 某一项的右上角的红点
index:0 abBar 的哪一项,从左边算起
*/
btnClick1:function(){
wx.showTabBarRedDot({
index: 0,
})
},
btnClick2:function(){
wx.hideTabBarRedDot({
index: 0,
})
},
/**
*
* wx.setTabBarBadge 为 tabBar 某一项的右上角添加文本
index tabBar 的哪一项,从左边算起
text 显示的文本,超过 4 个字符则显示成 ...
wx.removeTabBarBadge 移除 tabBar 某一项右上角的文本
index tabBar 的哪一项,从左边算起
*/
btnClick3: function(){
wx.setTabBarBadge({
index: 0,
text: '99',
})
},
btnClick4:function(){
wx.removeTabBarBadge({
index: 0,
})
},
/**
* wx.showTabBar显示 tabBar
animation:false 否 是否需要动画效果
wx.hideTabBar隐藏 tabBar
animation:false 否 是否需要动画效果
*/
btnClick5: function(){
wx.hideTabBar({
animation: true, //是否需要动画效果
})
},
btnClick6: function(){
wx.showTabBar({
animation: true,
})
},
/**
*
wx.setTabBarItem 动态设置 tabBar 某一项的内容
index tabBar 的哪一项,从左边算起
text tab 上的按钮文字
iconPath 图片路径,icon 大小限制为 40kb,建议尺寸为 81px * 81px,当 postion 为 top 时,此参数无效,不支持网络图片
selectedIconPath 选中时的图片路径,icon 大小限制为 40kb,建议尺寸为 81px * 81px ,当 postion 为 top 时,此参数无效
*/
btnClick7:function(){
wx.setTabBarItem({
index: 0,
text:'改变',
iconPath:'images/爱心.png',
selectedIconPath: 'images/爱心1.png'
})
},
/**
*
wx.setTabBarStyle动态设置 tabBar 的整体样式
color tab 上的文字默认颜色,HexColor
selectedColor tab 上的文字选中时的颜色,HexColor
backgroundColor tab 的背景色,HexColor
borderStyle tabBar上边框的颜色, 仅支持 black/white
*/
btnClick8: function (options) {
wx.setTabBarStyle({
color: '#FF0000',
selectedColor: '#FFFF00',
backgroundColor: '#00FFFF',
borderStyle: 'white'
})
},