多选 QML 组合框

Question

我正在构建我的第一个应用程序，我想要一个包含某些选项的组合框；选择这些选项中的一个时，我希望另一个组合框填充某些选项。此外，如果用户在第一个组合框中选择第二个选项，则第二个选项会填充不同的选项。这可能吗？我一直在胡闹一段时间，似乎无法找到如何去做。

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.2

ApplicationWindow {
    id: rootWindow
    visible: true
    width: 1000
    height: 800
    title: qsTr("Hello World!")

    ComboBox{
        id: country
        model: ["USA", "India"]
        onActivated: {
            console.debug("CombBox.onActivated", index)
            console.assert(currentIndex == index, "Assertion failed: property currentIndex not equal to actual parameter index")
        }
    }
    ComboBox{
        id: state
        model: ["California", "Assam"]
        onActivated: {
            console.debug("CombBox.onActivated", index)
            console.assert(currentIndex == index, "Assertion failed: property currentIndex not equal to actual parameter index")
        }
    }
    ComboBox{
        id: city
        model: ["Los Angeles", "Dispur"]
        onActivated: {
            console.debug("CombBox.onActivated", index)
            console.assert(currentIndex == index, "Assertion failed: property currentIndex not equal to actual parameter index")
        }
    }
    ComboBox{
        id: zip
        model: ["90001", "781005"]
        onActivated: {
            console.debug("CombBox.onActivated", index)
            console.assert(currentIndex == index, "Assertion failed: property currentIndex not equal to actual parameter index")
        }
    }
}

任何关于如何传递这些信号的想法将不胜感激

Answer 1

我会按照 javascript:

中相同的方式来做

import QtQuick 2.11
import QtQuick.Window 2.11
import QtQuick.Layouts 1.11
import QtQuick.Controls 2.4

Window {
    visible: true
    width: 640
    height: 480

    property var countryStateInfo: {
        "USA": {
            "California": {
                "Los Angeles": ["90001", "90002", "90003", "90004"],
                "San Diego": ["92093", "92101"]
            },
            "Texas": {
                "Dallas": ["75201", "75202"],
                "Austin": ["73301", "73344"]
            }
        },
        "India": {
            "Assam": {
                "Dispur": ["781005"],
                "Guwahati" : ["781030", "781030"]
            },
            "Gujarat": {
                "Vadodara" : ["390011", "390020"],
                "Surat" : ["395006", "395002"]
            }
        }
    }

    ColumnLayout {
        anchors.centerIn: parent
        ComboBox {
            id: box1
            currentIndex: -1
            model: getData(countryStateInfo)
        }
        ComboBox {
            id: box2
            model: box1.currentIndex < 0 ? [] : getData(countryStateInfo[box1.displayText])
            onModelChanged: currentIndex = -1
        }
        ComboBox {
            id: box3
            model: box2.currentIndex < 0 ? [] : getData(countryStateInfo[box1.displayText][box2.displayText])
            onModelChanged: currentIndex = -1
        }
        ComboBox {
            id: box4
            model: box3.currentIndex < 0 ? [] : countryStateInfo[box1.displayText][box2.displayText][box3.displayText]
            onModelChanged: currentIndex = -1
        }
    }

    function getData(arr)
    {
        var retval = [];
        for(var element in arr)
        {
            retval.push(element)
        }
        return retval;
    }
}

也许这段代码需要一些重构，我只是不知道如何使用关联数组作为模型

多选 QML 组合框

Multiselect QML ComboBox

qt

combobox

qml

listmodel