Question

在我的MyHeader.qml中无法加载MyChild2.qml。如何将子qml页面加载到另一个子qml页面调用mmain.qml页面，如下所示。

TestProject文件夹
- qml文件夹
  - Main.qml
  - MyChild1.qml
  - mainui文件夹
    - MyHeader.qml
    - MyChild2.qml

import QtQuick 2.10
import QtQuick.Controls 2.2
import "."

// Main.qml

ApplicationWindow {
    id: rootApp

    Loader {
        id: loaderPage
        anchors.fill: parent
    }

    MyChild1 {
    }
}


// MyChild1.qml
import QtQuick 2.10
import QtQuick.Controls 2.2
import "."

Page {
    id: myItem1
    anchors.fill: parent

    MyHeader {
        anchors.top: parent.top
    }
}


// MyChild2.qml
import QtQuick 2.10
import QtQuick.Controls 2.2
import "."

Page {
    id: myItem2
    anchors.fill: parent

    Rectangle {
        anchors.fill: parent
        color: "#000000"
    }

}



// MyHeader.qml
import QtQuick 2.10
import QtQuick.Controls 2.2
import "."

    Rectangle {
        id: myHeader
        width: parent.width
        height: dp(30)
        color: "lightblue"

        Text {
            id: loadQML
            text: "Load QML"
            color: "#000000"
            font.pixelSize: dp(20)

            MouseArea {
                anchors.fill: parent
                onClicked: {
                    myItem1.visible = false
                    loaderPage.source = "MyChild2.qml"
                    loaderPage.Top
                }
            }
        }

    }

使用加载程序和连接我无法分配给不存在的属性“onPageChanged”

import QtQuick 2.10

import "mainui"

ApplicationWindow {
    id: rootApp

    signal pageChanged(int page);

    Loader {
        id:rootLoader
        anchors.fill: parent
        source: "mainui/Page1.qml"

        Connections {
            target: rootLoader.item
            onPageChanged: {
                switch(page)
                {
                    case 1: rootLoader.source = "mainui/Page1.qml"; break;
                    case 2: rootLoader.source = "mainui/Page2.qml"; break;
                }
            }
        }
    }

} // APP

Answer 1

由于Loader的范围限制，您无法访问其外的项目。但您可以通知 Loader执行某些操作。在下面的示例中，有2个组件定义信号。 Loader将此信号连接到处理程序：

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    id: win
    width: 400
    height: 400
    title: "Test"
    visible: true

    Component {
        id:  page1
        Rectangle {
            signal pageChanged(int page);
            anchors.fill: parent
            color: "orange"
            Text {
                anchors.centerIn: parent
                text: "PAGE 1\nClick to change"
                horizontalAlignment: Text.AlignHCenter
            }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    pageChanged(2);
                }
            }
        }
    }

    Component {
        id:  page2
        Rectangle {
            signal pageChanged(int page);
            anchors.fill: parent
            color: "lightblue"
            Text {
                anchors.centerIn: parent
                text: "PAGE 2\nClick to change"
                horizontalAlignment: Text.AlignHCenter
            }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    pageChanged(1);
                }
            }
        }
    }

    Loader {
        id: loader
        anchors.fill: parent
        sourceComponent: page1
        Connections {
            target: loader.item
            onPageChanged: {
                switch(page)
                {
                    case 1: loader.sourceComponent = page1; break;
                    case 2: loader.sourceComponent = page2; break;
                }
            }
        }
    }
}

如何将child1.qml页面加载到从another_child.qml页面调用的main.qml页面上

1 个答案: