创建前引用组件

Question

我有一个 TableView 对象，它由四个 TableViewColumn 对象组成。

TableView {
        id: tableConfig
        model: tableModel
        anchors.fill: parent

        TableViewColumn{
            role: "name"
            title: "Channels"
            width: tableConfig.width/ tableConfig.columnCount

        }
        TableViewColumn{
            id: usageCol
            title: "Type"
            delegate: usageComboDel
            width: tableConfig.width/tableConfig.columnCount
        }
        TableViewColumn{
            title: "Device"
            delegate: deviceTypeComboDel
            width: tableConfig.width/tableConfig.columnCount
        }
        TableViewColumn{
            id: pinClmn
            title: "PIN"
            delegate: pinComboDel
            width: tableConfig.width/tableConfig.columnCount
        }
    }

每个 ViewColumn 都使用自己的委托 Component 呈现。在我的应用程序中，我希望根据用户在 usageComboDel 委托中的选择更改 pinComboDel (ComboBox) 委托的模型。两位代表是：

Component {
        id: usageComboDel
        Item{
            anchors.fill: parent
            ComboBox {
                id: usageCombo
                model:
                    ListModel{
                    id: usageModel
                    ListElement { text: "PowerOut" }
                    ListElement { text: "AnalogOut" }
                    ListElement { text: "PwmOut" }
                    ListElement { text: "DigitalOut" }
                    ListElement { text: "BldcOut" }
                    ListElement { text: "AnalogIn" }
                    ListElement { text: "PwmIn" }
                    ListElement { text: "DigitalIn" }
                    ListElement { text: "Can" }
                }
                currentIndex: 0
                height: 16
                anchors.fill: parent
                onCurrentTextChanged: {
                    tableModel.setProperty(styleData.row,"use",currentText);
                }
            }
        }

    }
Component{
        id: pinComboDel
        Item{
            id: itemPinComboDel
            anchors.fill: parent
            ComboBox {
                id: pinCombo
                model: {if (usageCombo.currentText === "PowerOut") { modelPowerOut;}
                    else if (usageCombo.currentText === "AnalogOut") { modelAnalogOut;}
                    else if (usageCombo.currentText === "AnalogIn") { modelAnalogIn;}
                    else if (usageCombo.currentText === "PwmOut") { modelPwmOut; }
                    else if (usageCombo.currentText === "DigitalOut" || usageCombo.currentText === "BldcOut" || usageCombo.currentText === "DigitalIn") { modelDigitalBldc; }
                    else if (usageCombo.currentText === "PwmIn") { modelPwmIn; }
                    else if (usageCombo.currentText === "Can") { modelCan; }
                }
                height: 16
                anchors.fill: parent
                onCurrentTextChanged: {
                    tableModel.setProperty(styleData.row,"pin",currentText);
                }
            }
            ListModel {
                id: modelPowerOut
                /* list elements */
            }
            ListModel {
                id: modelAnalogOut
                /* list elements */
            }
            ListModel {
                id: modelAnalogIn
                /* list elements */
            }
            ListModel {
                id: modelDigitalBldc
                /* list elements */
            }
            ListModel {
                id: modelPwmIn
                /* list elements */
            }
            ListModel {
                id: modelCan
                /* list elements */
            }

        }

    }

当我运行收到申请时 ReferenceError: usageCombo is not defined 在 pinCombo 组合框内。

我认为造成这种情况的原因是，当我对 Component{ ...} 部分进行编码时，我只是在声明一个组件的存在，就好像我会在单独的 .qml 中创建它一样文件。但是，这也不意味着它被实例化了。当用作 ViewColumn 的委托时，该组件通过 tableConfig View 实例化。因此，pinComboDel看不到usageComboDel的索引，至于第一个，第二个不存在。

我会把它命名为 'Reference to component before it is created'。

我想过但没有尝试过的一个可能的解决方案是，我可以为每个模型创建 6 个单独的代表。但是，出于一致性和效率的原因，我想避免这种情况并以正确的方式开发东西。

那么首先，我对问题的理解是否正确？第二，因此这两个组件最终被实例化为委托，他们不应该能够 see 彼此吗？第三，这可能发生吗？或者我应该尝试以其他方式开发它？

Answer 1

由于范围问题，您无法从外部访问委托。但是委托可以访问其父级，因此创建一些外部属性并将委托绑定到它是合乎逻辑的。例如：

Row {
    anchors.centerIn: parent
    Repeater {
        id: main
        model: 5
        property color clr: Qt.rgba(Math.random(),Math.random(),Math.random(),1)
        delegate: Rectangle {
            width: 50
            height: 50
            color: Qt.lighter(main.clr, 1.0 + index / 10)
            border { width: 1; color:"#999" }
            MouseArea {
                anchors.fill: parent
                cursorShape: Qt.PointingHandCursor
                onClicked: {
                    main.clr = Qt.rgba(Math.random(),Math.random(),Math.random(),1)
                }
            }
        }
    }
}

Answer 2

我直接把 delegate: 属性填入了 TableViewColumn 。我听从了@folibis 的建议，为两列创建了一个属性并将它们绑定在一起。因此，当第一个委托发生变化时，第二个委托也会更新。

TableViewColumn{
            id: usageCol
            title: "Type"
            property string modelName: "Power Out"
            delegate: ComboBox {
                id: usageCombo
                model:
                    ListModel{
                    id: usageModel
                    ListElement { text: "PowerOut" }
                    ListElement { text: "AnalogOut" }
                    ListElement { text: "PwmOut" }
                    ListElement { text: "DigitalOut" }
                    ListElement { text: "BldcOut" }
                    ListElement { text: "AnalogIn" }
                    ListElement { text: "PwmIn" }
                    ListElement { text: "DigitalIn" }
                    ListElement { text: "Can" }
                }
                currentIndex: 0
                height: 16
                anchors.fill: parent
                onCurrentTextChanged: {
                    tableModel.setProperty(styleData.row,"use",currentText);
                    usageCol.modelName = currentText;
                }
            }
            width: tableConfig.width/tableConfig.columnCount
        }
TableViewColumn{
            id: pinCol
            title: "PIN"
            property string modelName: usageCol.modelName
            delegate: ComboBox {
                id: pinCombo
                model: {if (pinCol.modelName === "PowerOut") { modelPowerOut;}
                    else if (pinCol.modelName === "AnalogOut") { modelAnalogOut;}
                    else if (pinCol.modelName === "AnalogIn") { modelAnalogIn;}
                    else if (pinCol.modelName === "PwmOut") { modelPwmOut; }
                    else if (pinCol.modelName === "DigitalOut" || pinCol.modelName === "BldcOut" || pinCol.modelName === "DigitalIn") { modelDigitalBldc; }
                    else if (pinCol.modelName === "PwmIn") { modelPwmIn; }
                    else if (pinCol.modelName === "Can") { modelCan; }
                }
                height: 16
                anchors.fill: parent
                onCurrentTextChanged: {
                    tableModel.setProperty(styleData.row,"pin",currentText);
                }
            }
            width: tableConfig.width/tableConfig.columnCount
        }

创建前引用组件

Reference to component before creation

qt

referenceerror

qml

qtquickcontrols2