SplitView示例：如果引入了Item包装器，则TabBar交互将停止工作

Question

在学习QML的过程中，我一直在玩一些SplitView示例，以期在应用程序中使用它。

我从在SO答案（请参阅here）中找到的示例开始，该示例已在下面复制。

我通过在层次结构中添加ColumnLayout来引入了Item元素的简单包装。乍一看，这没有任何作用，但在仔细检查后，TabBar与SwipeView的交互已中断。页面颜色应该随着选择选项卡按钮或滑动Swip​​eView区域而改变。

import QtQuick 2.6
import QtQuick.Layouts 1.1
import QtQuick.Window 2.0
import QtQuick.Controls 2.2
import QtQuick.Controls 1.4

Window {
    id: window
    visible: true
    width: 600
    height: 400
    SplitView {
        id: splitView
        anchors.fill: parent

        Rectangle {
            Layout.maximumWidth: window.width - 400
            width: window.width - 400
            Page {
                id: page
                width: parent.width

                Text {
                    id: text1
                    text: qsTr("Page")
                    anchors.right: parent.right
                    anchors.rightMargin: 170
                    font.pixelSize: 12
                }
            }
        }

        // Item { // UNCOMMENT TO SEE ISSUE
            ColumnLayout {
                id: col
                clip: true
                spacing: 0
                width: 400

                TabBar {
                    id: tabbar
                    Layout.fillWidth: true
                    currentIndex: view.currentIndex

                    TabButton {
                        text: qsTr("1")
                    }

                    TabButton {
                        text: qsTr("2")
                    }

                    TabButton {
                        text: qsTr("3")
                    }
                }

                SwipeView {
                    id: view
                    currentIndex: tabbar.currentIndex
                    Layout.fillWidth: true
                    Layout.fillHeight: true

                    Item {
                        id: tab0
                        Rectangle {
                            color: "red"
                        }
                    }


                    Item {
                        id: tab1
                        Rectangle {
                            anchors.fill: parent
                            color: "blue"
                        }
                    }


                    Item {
                        id: tab2
                        Rectangle {
                            anchors.fill: parent
                            color: "lightblue"
                        }
                    }
                }
            }
        //} // UNCOMMENT TO SEE ISSUE
    }
}

我现在甚至不确定我要通过此更改实现什么目标，但我仍然想了解问题出在哪里，以改善我的QML工作原理的“心理模型”。