如何从父组合框动态更新子组合框

How to dynamically update a child combobox from parent combobox

我有一个 QML 应用程序,它有两个组合框,一个是父(国家)组合框,另一个是子(城市)组合框。选择国家时,子组合框应同时包含该国家/地区的城市。

我有一个代码,第一个组合框选择国家,但它没有设置城市组合框的列表模型。重新打开应用程序后设置。

import QtQuick 2.11
import QtQuick.Window 2.11
import QtQuick.Controls 2.4
import QtQuick.Layouts 1.3
import Qt.labs.settings 1.0
ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    property alias comboBox: comboBox2
    Settings{
        property alias country : comboBox2.currentIndex
    }
    Dialog {
        id: dialog
        title: "Select Country"
        implicitWidth: parent.width
        implicitHeight: parent.height/2
        Column{
        ComboBox {
            id: comboBox2
            x: 199
            y: 176
            width: 277
            height: 48
            currentIndex: 0
            flat: false
            model: ["USA","Russia","Iran"]
        }
        }
    }
    ColumnLayout{
        anchors.horizontalCenter: parent.horizontalCenter
        spacing:20
        width: parent.width
    Button{
        anchors.horizontalCenter: parent.horizontalCenter
        id:select_country
        text:"select country"
        onClicked: dialog.open()
    }
    RowLayout{
        anchors.horizontalCenter: parent.horizontalCenter
        spacing:5
        width: parent.width
      Text {
         text:"Select City: "
       }
    ComboBox {
        id: comboBox1
        x: 199
        y: 176
        width: 277
        height: 48
        model: ListModel {
            id: model1
            dynamicRoles: true
            Component.onCompleted: {
                coord_combo()
                    }
            function coord_combo(){
                var i = comboBox1.currentIndex
                if (comboBox2.currentIndex===0){
                    comboBox1.model = ["New York","Washington","Houston"]
                    return comboBox1
                }
                else if (comboBox2.currentIndex === 1){
                    comboBox1.model = ["Moscow","Saint Petersburg","Novosibirsk"]

                    return comboBox1
                }
                else if (comboBox2.currentIndex === 2){
                    comboBox1.model = ["Tehran","Tabriz","Shiraz"]
                    return comboBox1
                }
            }
        }
    }
    }
    }
}

我使用 javascript 函数通过组合框更改 Material QML 主题。但同样的逻辑不适用于更新其他组合框的列表模型。有什么方法可以使用 qml 和 javascript 动态更新子组合框?

您应该在父 ComboBox 中使用 onCurrentIndexChanged 信号,并在触发时更新子 ComboBox。像这样;

onCurrentIndexChanged:
{
    if(currentIndex === 0)
        comboBox1.model = ["New York", "Washington", "Houston"]
    ...
}

你可以更进一步,写一个函数来获取当前国家的城市。然后,只要父 ComboBox 的 currentIndex 发生变化,您就可以更新子 ComboBox 的模型。