Qml TabView 如何动态建立Tab

         

TabView {
            id: pd_top_tabView
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.top: parent.top
            anchors.topMargin: 10
            anchors.bottom: parent.bottom
            anchors.bottomMargin: pd_bottom_bar.visible ? 45 : 0
            onCurrentIndexChanged: {
                console.log("current index = " + currentIndex)
            }

            style: TabViewStyle {
                tabBar: Rectangle {
                    color: "#FFF0F0F0"
                }

                tab: Rectangle {

function getTabImage() {
                        if(styleData.selected) {
                            return "qrc:/images/tab_active.png";
                        }
                        else {
                            return "qrc:/images/tab_inactive.png";
                        }
                    }

                    id: id_tabBackground
                    color: "#FFF0F0F0"
                    implicitWidth: 35
                    implicitHeight: 33 + 7
                    Image {
                        id: id_image
                        source: getTabImage()
                        anchors.top: id_tabBackground.top
                        anchors.topMargin: 0
                        anchors.bottom: id_tabBackground.bottom
                        anchors.bottomMargin: 7
                        anchors.horizontalCenter: parent.horizontalCenter
                        fillMode: Image.Stretch
                    }
                    Text {
                        id: id_text
                        text: styleData.title
                        color: "#000000"
                        font.pixelSize: 14
                        anchors.verticalCenter: id_image.verticalCenter
                        anchors.horizontalCenter: id_image.horizontalCenter
                    }
                }
            }

            Component.onCompleted: {
                resetAllTabs()
                autoSelectActiveTab()
            }
        }

        上面是 TabView的定义，名字为 pd_top_tabView

    下面定义一个建立tab的 函数：

    

//functions
    function createTab(index) {

        var component = Qt.createComponent("TabContentView.qml")
        if(component.status === Component.Ready){
            console.log("component ready")
            var tab = pd_top_tabView.addTab(qsTr("Tab") + " " + (index + 1), component)
            tab.active = true
            if(!tab){
                console.log("tab == null") ;
            }

            var item = tab.item
            if(item){
                tab.item.strName = "tabName"
            }
            else {
                console.log("item == null")
            }
        }
        else {
            console.log("component not ready")
        }
    }

   这个createTab 函数里面有句： tab.active = true 必定要主要加上，不然建立第一个tab的时候会成功，可是建立后续的tab也会成功，可是不能给 tab 对应的qml 的属性 strName赋值，会出现 type error错误，致使无法初始化 tab item .