微信小程序开发过程中应用了自定义tabBar,运行官网提供的demo是没有问题的,然而本人增加了新的tab-item后点击会呈现谬误,具体表现为:点击一次tab跳到指定的页面,然而tabBar的状态还停留在上一个,再次点击能力更新。

问题剖析

Component({  data: {    selected: 0,    color: "#7A7E83",    selectedColor: "#3cc51f",    list: [{      pagePath: "/index/index",      iconPath: "/image/icon_component.png",      selectedIconPath: "/image/icon_component_HL.png",      text: "组件"    }, {      pagePath: "/index/index2",      iconPath: "/image/icon_API.png",      selectedIconPath: "/image/icon_API_HL.png",      text: "接口"    }]  },  attached() {  },  methods: {    switchTab(e) {      const data = e.currentTarget.dataset      const url = data.path      wx.switchTab({url})      this.setData({        selected: data.index      })    }  }})

在methods的switchTab()办法中看似在切换tab后更新了以后选中的tab,然而这样是不够的,能够查看对应页面的show()中官网还增加了上面的代码:

// 组件页面show() {  if (typeof this.getTabBar === 'function' &&    this.getTabBar()) {    this.getTabBar().setData({      selected: 0    })  }}// 接口页面show() {  if (typeof this.getTabBar === 'function' &&    this.getTabBar()) {    this.getTabBar().setData({      selected: 1    })  }}

咱们本人新增加的页面正是应为短少了这段代码,才会呈现开始提到的问题。在新增的页面增加即可解决,留神你的selected值应该是tabBar数组中对应的index。