导航栏和标签页面分类处理-如何多个page页协同编码？

build() {
    // 使用 Stack 布局构建页面内容
    Stack() {
      // 使用 AtomicServiceTabs 组件创建底部导航栏和标签页内容
      AtomicServiceTabs({
        tabContents: [
          () => {
            this.tabContent1() // 第一个标签页内容：
          },
          () => {
            this.tabContent2() // 第二个标签页内容：
          },
          () => {
            this.tabContent3() // 第三个标签页内容：
          },
          () => {
            this.tabContent4() // 第四个标签页内容：个人中心页面
          }
        ],
        tabBarOptionsArray: this.listBar, // 设置底部导航栏选项数组
        tabBarPosition: TabBarPosition.BOTTOM, // 设置底部导航栏位置为底部
        barBackgroundColor: $r('sys.color.ohos_id_color_bottom_tab_bg'), // 设置底部导航栏背景颜色
        onTabBarClick: this.onTabClick, // 设置标签点击回调函数
        onContentWillChange: this.onContentWillChangeCallBack, // 设置内容将要改变的回调函数
      })
    }
    .height('100%') // 设置 Stack 布局的高度为 100%
  }
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.