微信小程序自定义tabbar底部导航栏跳tabbar时怎么保留这个自定义导航栏

微信小程序中，如果你想要在从某个页面通过点击底部自定义TabBar跳转到其他页面时仍然保留该自定义导航栏，你需要遵循以下步骤：

1. **设置`navigatorStyle`**：在小程序的App.json文件里，配置全局的`navigatorStyle`为"custom"，这会让所有页面都使用自定义的TabBar样式。

{
  "pages": [...],
  "window": {
    "navigationBarTextStyle": "black", // 标题颜色
    "navigationBarBackgroundColor": "#fff", // 背景色
    "navigationBarTitleText": "小程序名", // 标题文字
    "navigatorStyle": "custom" // 使用自定义导航栏
  },
  ...
}

2. **自定义TabBar组件**：创建一个单独的TabBar组件，其中包含各个页面的图标和标签。将这个组件放在需要显示它的地方，例如`index.js`中的`onLoad`生命周期内。

Page({
  data: { ... },
  onLoad() {
    wx.setNavigationBarTitle({ title: '首页' }); // 设置默认标题
    this.setData({ tabBar: new TabBar() });
  },
  ...
})

3. **动态切换Tab**：在每个页面内部，你可以通过`wx.navigateTo`或`wx.switchTab`等API，并传递当前页面对应的`data-tab`标识，让TabBar根据这个标识自动切换内容。

// 页面A
buttonClick: function(e) {
  var tabIndex = e.currentTarget.dataset.tabIndex;
  wx.navigateTo({
    url: '/pageB',
    tabBarItem: {
      text: '页面B',
      iconPath: 'path/to/b-icon.png',
      selectedIconPath: 'path/to/b-selected-icon.png',
      index: tabIndex
    }
  });
}

// 页面B
backButtonClick: function() {
  wx.reLaunch({
    tabBarItem: {
      text: '页面A',
      iconPath: 'path/to/a-icon.png',
      selectedIconPath: 'path/to/a-selected-icon.png'
    }
  });
}

4. **注意页面间的通信**：确保在页面间传递的`tabItem`数据能正确更新TabBar的状态，以便保持导航栏的一致性。