uniapp如何解决自定义的tabbar切换页面闪烁的问题

自定义的 TabBar 在切换页面时会有闪烁的问题，这是因为在页面切换时，底部的 TabBar 也会重新渲染，导致闪烁。为了解决这个问题，可以考虑使用 `uni.hideTabBar()` 和 `uni.showTabBar()` 方法来手动控制底部 TabBar 的显示和隐藏。

具体做法如下：

1. 在 `App.vue` 中，监听路由变化，根据需要手动隐藏或显示 TabBar：

export default {
  onShow() {
    // 监听路由变化
    uni.$off('routeChange');
    uni.$on('routeChange', (to) => {
      // 判断是否需要隐藏 TabBar
      if (to.hideTabBar) {
        uni.hideTabBar();
      } else {
        uni.showTabBar();
      }
    });
  },
}

2. 在需要隐藏底部 TabBar 的页面中，设置 `hideTabBar` 属性为 `true`：

export default {
  data() {
    return {
      hideTabBar: true,
    };
  },
  onLoad() {
    // 触发路由变化事件，隐藏底部 TabBar
    uni.$emit('routeChange', { hideTabBar: true });
  },
  onUnload() {
    // 触发路由变化事件，显示底部 TabBar
    uni.$emit('routeChange', { hideTabBar: false });
  },
}

这样，当进入需要隐藏底部 TabBar 的页面时，TabBar 将会被手动隐藏，而不会重新渲染导致闪烁的问题。当页面离开时，再手动触发路由变化事件，显示底部 TabBar。