set-tab-bar.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. const defaultTabBarStyle = {
  2. color: '#7A7E83',
  3. selectedColor: '#3cc51f',
  4. backgroundColor: '#ffffff',
  5. }
  6. const defaultItemName = '接口'
  7. Component({
  8. data: {
  9. hasSetTabBarBadge: false,
  10. hasShownTabBarRedDot: false,
  11. hasCustomedStyle: false,
  12. hasCustomedItem: false,
  13. hasHiddenTabBar: false,
  14. },
  15. attached() {
  16. wx.pageScrollTo({
  17. scrollTop: 0,
  18. duration: 0
  19. })
  20. },
  21. detached() {
  22. this.removeTabBarBadge()
  23. this.hideTabBarRedDot()
  24. this.showTabBar()
  25. this.removeCustomStyle()
  26. this.removeCustomItem()
  27. },
  28. methods: {
  29. navigateBack() {
  30. this.triggerEvent('unmount')
  31. },
  32. setTabBarBadge() {
  33. if (this.data.hasSetTabBarBadge) {
  34. this.removeTabBarBadge()
  35. return
  36. }
  37. this.setData({
  38. hasSetTabBarBadge: true
  39. })
  40. wx.setTabBarBadge({
  41. index: 1,
  42. text: '1',
  43. })
  44. },
  45. removeTabBarBadge() {
  46. this.setData({
  47. hasSetTabBarBadge: false
  48. })
  49. wx.removeTabBarBadge({
  50. index: 1,
  51. })
  52. },
  53. showTabBarRedDot() {
  54. if (this.data.hasShownTabBarRedDot) {
  55. this.hideTabBarRedDot()
  56. return
  57. }
  58. this.setData({
  59. hasShownTabBarRedDot: true
  60. })
  61. wx.showTabBarRedDot({
  62. index: 1
  63. })
  64. },
  65. hideTabBarRedDot() {
  66. this.setData({
  67. hasShownTabBarRedDot: false
  68. })
  69. wx.hideTabBarRedDot({
  70. index: 1
  71. })
  72. },
  73. showTabBar() {
  74. this.setData({hasHiddenTabBar: false})
  75. wx.showTabBar()
  76. },
  77. hideTabBar() {
  78. if (this.data.hasHiddenTabBar) {
  79. this.showTabBar()
  80. return
  81. }
  82. this.setData({hasHiddenTabBar: true})
  83. wx.hideTabBar()
  84. },
  85. customStyle() {
  86. if (this.data.hasCustomedStyle) {
  87. this.removeCustomStyle()
  88. return
  89. }
  90. this.setData({hasCustomedStyle: true})
  91. wx.setTabBarStyle({
  92. color: '#FFF',
  93. selectedColor: '#1AAD19',
  94. backgroundColor: '#000000',
  95. })
  96. },
  97. removeCustomStyle() {
  98. this.setData({hasCustomedStyle: false})
  99. wx.setTabBarStyle(defaultTabBarStyle)
  100. },
  101. customItem() {
  102. if (this.data.hasCustomedItem) {
  103. this.removeCustomItem()
  104. return
  105. }
  106. this.setData({hasCustomedItem: true})
  107. wx.setTabBarItem({
  108. index: 1,
  109. text: 'API'
  110. })
  111. },
  112. removeCustomItem() {
  113. this.setData({hasCustomedItem: false})
  114. wx.setTabBarItem({
  115. index: 1,
  116. text: defaultItemName
  117. })
  118. }
  119. }
  120. })