ReferenceError: ueUserInfoListView is not defined

Question

我正在开发 QML/Qt 应用程序，我有以下 ListView，名称 ueUserInfoListView:

    ListView
    {
        id: ueUserInfoListView

        antialiasing: true

        Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter
        Layout.fillWidth: true
        Layout.fillHeight: true
        Layout.margins: 8

        clip: true

        spacing: 64

        orientation: ListView.Horizontal

        highlightFollowsCurrentItem: true

        delegate: Image
        {
            id: ueUserInfoListViewDelegate

            source: "image://uePeopleModel/"+model.ueRoleImage

            opacity: 0.3

            fillMode: Image.PreserveAspectFit

            function ueDoOpacity()
            {
                if(ueUserInfoListViewDelegate===ueUserInfoListView.currentItem)
                    opacity=1.0
                else
                    opacity=0.3
            }

            Behavior on opacity
            {
                NumberAnimation
                {
                    duration: 300
                }   // NumberAnimation
            }   // Behavior

            Component.onCompleted:
            {
                ueUserInfoListViewDelegate.focusChanged.connect(ueDoOpacity)
            }   // Component.onCompleted
        }   // delegate

        Component.onCompleted:
        {
            model=uePeopleModel
        }   // Component.onCompleted

        preferredHighlightBegin: width/2-70
        preferredHighlightEnd: width/2+70
        highlightRangeMode: ListView.StrictlyEnforceRange
        currentIndex: count/2
    }   // ListView

我正在尝试从另一个分离的（根据文件）Item 调用 ueUserInfoListView，命名为 ueProductSelector:

import QtQuick 2.5
import QtQuick.Layouts 1.2

import si.mikroelektronika 1.0

Item
{
    id: ueProductSelector

    antialiasing: true

    clip: true

    Rectangle
    {
        id: ueProductSelectorWrapper

        radius: 16
        gradient: Gradient
        {
            GradientStop
            {
                position: 0
                color: "#ffffff"
            }   // GradientStop

            GradientStop
            {
                position: 1
                color: "#000000"
            }   // GradientStop
        }   // Gradient

        border.color: "#4682b4"
        border.width: 1

        antialiasing: true

        anchors.centerIn: parent
        anchors.fill: parent

        ColumnLayout
        {
            anchors.margins: parent.radius/2

            spacing: 0
            antialiasing: true

            anchors.fill: parent
            anchors.centerIn: parent

            GridView
            {
                id: ueProductGridView

                antialiasing: true

                clip: true

                Layout.fillWidth: true
                Layout.fillHeight: true

                cellWidth: 144
                cellHeight: 144

                model: ueProductsModel

                delegate: Rectangle
                {
                    radius: 16

                    clip: true

                    width: ueProductGridView.cellWidth-8
                    height: ueProductGridView.cellHeight-8

                    border.color: "#4682b4"

                    antialiasing: true

                    gradient: Gradient
                    {
                        GradientStop
                        {
                            position: 0
                            color: "#000000"

                            ParallelAnimation on color
                            {
                                id: ueProductSelectorDelegateMouseAreaAnimation

                                loops: 1
                                running: false//ueDelegateMouseArea.pressed

                                ColorAnimation
                                {
                                    from: "#4682b4"
                                    to: "#000000"
                                    duration: 100
                                }   // ColorAnimation
                            }   // ParallelAnimation
                        }   // GradientStop

                        GradientStop
                        {
                            position: 1
                            color: "#ffffff"
                        }   // GradientStop
                    }   // Gradient

                    MouseArea
                    {
                        id: ueDelegateMouseArea

                        anchors.fill: parent

                        onClicked:
                        {
                            var selectedIndex=ueProductGridView.currentIndex=index;

                            ueProductSelectorDelegateMouseAreaAnimation.running=true;
                            ueProductGridView.currentIndex=index;

                             ueOrdersModel.ueSetRecordValues(ueUserInfoListView.model.get(ueUserInfoListView.currentIndex).ueRoleId,
                                                             uePlacesListView.model.get(uePlacesListView.currentIndex).ueRoleId,
                                                             ueProductGridView.model.get(selectedIndex).ueRoleProductId,
                                                             1);
                        }   // onClicked
                    }   // MouseArea

                    ColumnLayout
                    {
                        anchors.centerIn: parent
                        anchors.fill: parent

                        antialiasing: true

                        spacing: 8

                        Image
                        {
                            Layout.fillWidth: true
                            Layout.fillHeight: false
                            Layout.alignment: Qt.AlignCenter|Qt.AlignTop
                            Layout.topMargin: ueProductSelectorWrapper.radius+4

                            fillMode: Image.PreserveAspectFit

                            horizontalAlignment: Image.AlignHCenter
                            verticalAlignment: Image.AlignVCenter

                            antialiasing: true
                            source: "image://ueProductsModel/"+model.ueRoleImage
                        }   // Image

                        Text
                        {
                            Layout.fillWidth: true
                            Layout.fillHeight: true
                            Layout.alignment: Qt.AlignCenter|Qt.AlignBottom
                            Layout.bottomMargin: ueProductSelectorWrapper.radius+4

                            color: "#000000"

                            text: model.ueRoleProductName
                            wrapMode: Text.WordWrap
                            font.family: "Courier"
                            textFormat: Text.RichText

                            font.bold: true
                            font.pointSize: 10

                            verticalAlignment: Text.AlignVCenter
                            horizontalAlignment: Text.AlignHCenter
                        }   // Text
                    }   // ColumnLayout
                }   // delegate

                Component.onCompleted:
                {
                    ueProductSelectorOpacityAnimator.running=true
                }
            }   // GridView
        }   // ColumnLayot
    }   // Rectangle
}   // Item

我收到以下错误：

qrc:/gui/items/UeProductSelector.qml:126: ReferenceError: ueUserInfoListView is not defined Why?

Answer 1

如果 MouseArea 在 UeDelegate.qml 中声明，并且 UeListView.qml（为示例起见的虚构文件名）包含指定 UeDelegate作为其delegate，本would work。根据您提供给我们的信息，我们只能假设 ListView 不是 MouseArea.

的祖先

详细说明这个概念：

The component instance scope hierarchy extends to out-of-line components, too. In the following example, the TitlePage.qml component creates two TitleText instances. Even though the TitleText type is in a separate file, it still has access to the title property when it is used from within the TitlePage. QML is a dynamically scoped language - depending on where it is used, the title property may resolve differently.

// TitlePage.qml
import QtQuick 2.0
Item {
    property string title

    TitleText {
        size: 22
        anchors.top: parent.top
    }

    TitleText {
        size: 18
        anchors.bottom: parent.bottom
    }
}

// TitleText.qml
import QtQuick 2.0
Text {
    property int size
    text: "<b>" + title + "</b>"
    font.pixelSize: size
}

Answer 2

嗯，你应该不这样做。在单独的 QML 组件文件中使用另一个组件的 ID 是邪恶的！

不惜一切代价尽量避免这种情况。它将耦合您的 QML 组件并且它们不是真正可重用的。

因此，要解决您的问题，您应该将 ListView 组件作为属性传递给您的 ueProductSelector 组件：

    import QtQuick 2.5
    import QtQuick.Layouts 1.2

    import si.mikroelektronika 1.0

    Item
    {
        id: ueProductSelector

        antialiasing: true

        clip: true

        property ListView ueUserInfoListView

        // [...]
    }

那么你应该可以调用

ueOrdersModel.ueSetRecordValues(ueUserInfoListView.model.get(ueUserInfoListView.currentIndex).ueRoleId,
                                                             uePlacesListView.model.get(uePlacesListView.currentIndex).ueRoleId,
                                                             ueProductGridView.model.get(selectedIndex).ueRoleProductId,
                                                             1);

在你的第二个组件中。

ListView 组件作为 (QObject*) 的引用传递，不应是性能关键。

ReferenceError: ueUserInfoListView is not defined

ReferenceError: ueUserInfoListView is not defined

qml

qt5

qtquick2