How can I use a MouseArea to change the item in a StackLayout?

```
MouseArea {
           id: mouseAreaServerSetup
           anchors.fill: parent
           onClicked:{
                     // change Iten serverSetupPage
                     }
           }

MouseArea {
           id: mouseAreaClientSetup
           anchors.fill: parent
           onClicked: {
                      // change Iten clientSetupPage
                      }
           }

StackLayout {
             anchors.fill: parent
             currentIndex: menuConfig.currentIndex
             Item {
                  id: serverSetupPage
                  Rectangle {
                            color: "red"
                            }
                  }
             Item {
                  id: clientSetupPage
                  Rectangle {
                            color: "yellow"}
                            }
                   }
             }

```

The idea is that when you click on a mouseArea you change Tab Item

Thanks