TabBar с наполненным контентом на каждый TabBatton

[SektorCT]

Всем привет.
Подскажиет пожалуйста, как правильно заполнить каждый из табов контентом из отдельного qml файла?

Код:

 TabBar
    {
        id: tabBar

        width: parent.width
        TabButton
        {
            text: qsTr("Home")

            General
            {
                id: general
                anchors.fill: parent
            }

        }
        TabButton {
            text: qsTr("Discover")
        }
        TabButton {
            text: qsTr("Activity")
        }
}

Если я вот атк делаю то у меня почему то контент из General отображается на каждом табе да еще и залезает на саму кнопку таба)
Подскажиет плиз где я допускаю ошибку?
Спасибо.

[Vladimir]

нужно разделить создание кнопок TabBar и контента. Отдельно создаете TabBar и наполняете его кнопками

Код:

TabBar {
   id: barTabs
               
   Component
   {
          id: compBtnTab
          TabButton
          {
               .....
          }
    }
}

и отдельно компонент, где будет отображаться контент, например

Код:

 StackLayout {
      id: stackPage
      width: parent.width; height: parent.height
}

и связываете их через именение индекса по нажатию на кнопку таба

Код:

onReleased: {                                       
    stackPage.currentIndex = barTabs.currentIndex
}