CRMEB_Uniapp/custom-tab-bar/index.js

Component({
  data: {
    selected: 0,
    color: "#999999",
    selectedColor: "#FF6600",
    backgroundColor: "#FFFFFF",
    list: [{
      pagePath: "/pages/index/index",
      iconPath: "/static/tabbar/home.png",
      selectedIconPath: "/static/tabbar/home-active.png",
      text: "首页"
    }, {
      pagePath: "/pages/community/index",
      iconPath: "/static/tabbar/community.png",
      selectedIconPath: "/static/tabbar/community-active.png",
      text: "社区"
    }, {
      pagePath: "/pages/legou/index",
      iconPath: "/static/tabbar/legou.png",
      selectedIconPath: "/static/tabbar/legou-active.png",
      text: "乐购",
      isSpecial: true // 标记为特殊按钮
    }, {
      pagePath: "/pages/cart/index",
      iconPath: "/static/tabbar/cart.png",
      selectedIconPath: "/static/tabbar/cart-active.png",
      text: "购物车"
    }, {
      pagePath: "/pages/user/index",
      iconPath: "/static/tabbar/user.png",
      selectedIconPath: "/static/tabbar/user-active.png",
      text: "我的"
    }]
  },
  
  attached() {
    // 延迟获取当前页面，确保页面已经完全加载
    setTimeout(() => {
      this.setTabBarIndex()
    }, 100)
  },
  
  methods: {
    switchTab(e) {
      try {
        const data = e.currentTarget.dataset
        const url = data.path
        const index = data.index
        
        console.log('切换到tab:', url, 'index:', index)
        
        // 更新选中状态
        this.setData({
          selected: index
        })
        
        // 页面跳转
        wx.switchTab({
          url,
          success: () => {
            console.log('页面跳转成功:', url)
            // 跳转成功后更新全局tabBar状态
            try {
              if (typeof this.getTabBar === 'function' && this.getTabBar()) {
                this.getTabBar().setData({
                  selected: index
                })
              }
            } catch (error) {
              console.log('更新全局tabBar状态失败:', error)
            }
          },
          fail: (error) => {
            console.error('页面跳转失败:', error)
          }
        })
      } catch (error) {
        console.error('切换tab失败:', error)
      }
    },
    
    // 设置当前tabBar索引
    setTabBarIndex() {
      try {
        const pages = getCurrentPages()
        if (!pages || pages.length === 0) {
          console.log('页面栈为空，稍后重试')
          // 如果页面栈为空，延迟重试
          setTimeout(() => {
            this.setTabBarIndex()
          }, 200)
          return
        }
        
        const currentPage = pages[pages.length - 1]
        if (!currentPage || !currentPage.route) {
          console.log('当前页面信息不完整，使用默认索引')
          this.setData({ selected: 0 })
          return
        }
        
        const url = '/' + currentPage.route
        console.log('当前页面路径:', url)
        
        const index = this.data.list.findIndex(item => item.pagePath === url)
        if (index !== -1) {
          this.setData({
            selected: index
          })
          console.log('设置tabBar选中索引:', index)
        } else {
          console.log('未找到匹配的tabBar页面，使用默认索引')
          this.setData({ selected: 0 })
        }
      } catch (error) {
        console.error('设置tabBar索引失败:', error)
        // 出错时设置默认选中首页
        this.setData({ selected: 0 })
      }
    },
    
    // 更新选中状态的方法，供页面调用
    updateSelected(index) {
      try {
        console.log('更新tabBar选中状态:', index)
        this.setData({
          selected: index
        })
      } catch (error) {
        console.error('更新选中状态失败:', error)
      }
    }
  }
})