HarmonyOS 请问TabContent如何与page绑定？

import { Home } from "@ohos/home" 
import { NewProduct } from "@ohos/newproduct" 
import { ShopCart } from "@ohos/shopcart" 
import { Personal } from "@ohos/personal" 
 
@Entry 
@Component 
 
struct  MainPage{ 
  @StorageProp('currentBreakpoint') currentBreakpoint: string = 'sm' 
  @State spaOpacity:number = 0 
  @State spaScale:number = 1 
  private controller: TabsController = new TabsController() 
  @State selectIndex: number = 0 
  private data: MyDataSource = new MyDataSource(); 
  pageTransition() { 
    PageTransitionEnter({ duration: 500, curve: Curve.Linear }).opacity(this.spaOpacity) 
      .onEnter((type: RouteType, progress: number) => { 
          this.spaOpacity = progress 
      }) 
    PageTransitionExit({ duration: 500, curve: Curve.Ease }) 
      .onExit((type: RouteType, progress: number) => { 
 
      }) 
  } 
 
  aboutToAppear(): void { 
    for (let i = 0; i <= 20; i++) { 
      this.data.pushData(`Hello ${i}`) 
    } 
  } 
 
  build() { 
    Tabs({ barPosition: BarPosition.End, controller: this.controller }) { 
      TabContent() { 
        Home() 
      } 
      .tabBar(BottomTabBarStyle.of($r(this.selectIndex == 0 ? 'app.media.ic_home_focus' : 'app.media.ic_home_normal'), '首页')) 
 
      TabContent() { 
        ShopCart() 
      } 
      .tabBar(BottomTabBarStyle.of($r(this.selectIndex == 1 ? 'app.media.ic_cart_focus' : 'app.media.ic_cart_normal'), '购物车')) 
 
      TabContent() { 
        NewProduct( 
        ) 
      } 
      .tabBar(BottomTabBarStyle.of($r(this.selectIndex == 2 ? 'app.media.ic_product_focus' : 'app.media.ic_product_normal'), '产品')) 
 
      TabContent() { 
        Personal({ 
          page:10 
        }) 
      } 
      .tabBar(BottomTabBarStyle.of($r(this.selectIndex == 3 ? 'app.media.ic_personal_focus' : 'app.media.ic_personal_normal'), '个人')) 
    }.onTabBarClick((index: number) => { 
      this.selectIndex = index 
    }) 
  } 
}

 "dependencies": { 
    "@ohos/common": "file:../common", 
    "@ohos/commoditydetail": "file:../features/commoditydetail", 
    "@ohos/home": "file:../features/home", 
    "@ohos/newproduct": "file:../features/newproduct", 
    "@ohos/personal": "file:../features/personal", 
    "@ohos/shopcart": "file:../features/shopcart", 
  }