QML:GridView模型对所有子项具有相同的值

我是QML编程的新手。在附加了JSON中的children值之后，我陷入了QML

GridView

-Model的奇怪行为。子计数与JSON长度匹配，但所有值都相同

这是我的密码：

        Item{
            id: prod_item_view
            x: 73
            y: 137
            width: 920
            height: 630
            anchors.bottom: parent.bottom
            anchors.bottomMargin: -767
            anchors.right: parent.right
            anchors.rightMargin: -1023
            focus: true    

            GridView{
                id: gridview
                focus: true
                anchors.bottomMargin: 0
                anchors.topMargin: 0
                flickDeceleration: 750
                maximumFlickVelocity: 1500
                anchors.centerIn: parent
                layoutDirection: Qt.LeftToRight
                flow: GridView.FlowLeftToRight
                boundsBehavior: Flickable.StopAtBounds
                snapMode: GridView.SnapToRow
                anchors.fill: parent
                anchors.margins: 20
                delegate: delegate_item_view
                model: groceryItem_listModel
                cellWidth: 215
                cellHeight: 315
            }

            ListModel {
                id: groceryItem_listModel
                function parseDataProduct(){
                    var items = JSON.parse(grocery_prod_list)
                    for(var x in items) {
                        if(items[x].name.indexOf("Test") > -1){
                            show_prod_name = items[x].name.replace("Test","")
                        }else{
                            show_prod_name = items[x].name.replace("/t","")
                        }
                        show_prod_price = insert_flg(items[x].total)
                        show_prod_disc = "Disc: " + insert_flg(items[x].discount)
                        show_prod_init_price = insert_flg(items[x].price)
                        show_prod_sku = items[x].sku
                        show_prod_image = items[x].image.replace(urlPath1,urlPath2)
                        show_prod_image_qr = items[x].qrcode.replace(urlPath1,urlPath2)
                        //Appending Product Items
                        groceryItem_listModel.append({"prod_name": show_prod_name,"prod_price":show_prod_price,"prod_disc": show_prod_disc,"prod_init_price":show_prod_init_price,"prod_sku":show_prod_sku,"prod_image":show_prod_image,"prod_image_qr":show_prod_image_qr})
                    }
                    //grocery_prod_list = ""
                    for(var i = 0; i < groceryItem_listModel.count; ++i) {
                        console.log(groceryItem_listModel.get(i).prod_name +" -> "+ groceryItem_listModel.get(i).prod_sku);
                    }
                }
                Component.onCompleted: {parseDataProduct()}
            }

            Component{
                id: delegate_item_view
                GroceryItemView{
                    id: item_view
                    prod_name: (prod_name_temp == "") ? show_prod_name : prod_name_temp
                    prod_price: (prod_price_temp == "") ? show_prod_price : prod_price_temp
                    prod_disc: (prod_disc_temp == "") ? show_prod_disc : prod_disc_temp
                    prod_init_price: (prod_init_price_temp == "") ? show_prod_init_price : prod_init_price_temp
                    prod_sku: (prod_sku_temp == "") ? show_prod_sku : prod_sku_temp
                    prod_image: (prod_image_temp == "") ? show_prod_image : prod_image_temp
                    function defineTemp(){
                        prod_disc_temp = show_prod_disc
                        prod_name_temp = show_prod_name
                        prod_price_temp = show_prod_price
                        prod_init_price_temp = show_prod_init_price
                        prod_sku_temp = show_prod_sku
                        prod_image_temp = show_prod_image
                        prod_image_qr_temp = show_prod_image_qr
                    }
                    Component.onCompleted: {defineTemp()}

                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            abc.counter = timer_value
                            my_timer.restart()
                            item_view.prod_init_price = ""
                            item_view.prod_disc = ""
                            item_view.prod_price = prod_sku_temp
                            item_view.font_size = 20
                            item_view.prod_image = prod_image_qr_temp
                            item_view.image_top_position = -42
                            item_view.text_click = false
                        }
                        onDoubleClicked: {
                            item_view.prod_price = prod_price_temp
                            item_view.prod_disc = prod_disc_temp
                            item_view.prod_init_price = prod_init_price_temp
                            item_view.prod_image = prod_image_temp
                            item_view.font_size = 30
                            item_view.image_top_position = 0
                            item_view.text_click = true
                        }
                    }
                }
            }
        }
    }   
}

打印的Console.log如下所示：

qml: Bali Alus Traditional Spa Essential Scrub with VCO Chocolate - 100 g -> PBSDIM00139
qml: Bali Alus Traditional Spa Essential Scrub with VCO Milk - 100 g -> PBSDIM00141
qml: Bali Alus Traditional Spa Essential Scrub with VCO Strawberry - 100 g -> PBSDIM00142
qml: Bath & Body Works - Ginger Bread -> PBSDIM00174
qml: Bath & Body Works - Hand Gel - Sugar & Spice -> PBSDIM00176
qml: Bath & Body Works - Hand Gel - Sugar Plum Dream -> PBSDIM00175
qml: Humphrey Bust Firming Lotion -> PBSDIM00151
qml: Humphrey Serum Vit C Whitening Plus -> PBSDIM00149
qml: I am Real Mask - Tony Moly -> PBSDIM00164
qml: Mane N Tail Original Shampoo - 60 mL -> PBSDIM00144
qml: Murrays Pomade Edgewax -> PBSDIM00143
qml: Mustika Ratu Body Butter Coffee Kopi - 200 g -> PBSDIM00146
qml: Natural Honey Body Lotion Antioxidant - 200 mL -> PBSDIM00150
qml: Sebamed Clear Face Cleansing Facial Toner - 150 ML -> PBSDIM00140
qml: Vaseline Petroleum  -> PBSDIM00158

---

好的，我找到了解决您问题的方法：

首先，您将

show\u prod\u name

等变量定义为全局属性。因此，每次您在

列表模型

中添加一个项目时，基本上都会覆盖

show\u prod\u name

。这就是为什么值总是最后一个JSON项的原因。事实上，你甚至不需要它作为一个全局变量

其次，您没有将委托设置为相应的键。例如，它应该是

prod\u name

，而不是

show\u prod\u name

。您需要使用密钥：

groceryItem\u listModel.append（{“产品名称”：显示产品名称，…}）

因此，您基本上可以将您的委托简化为：

Component{
                id: delegate_item_view
                GroceryItemView{
                    id: item_view
                    prod_name: prod_name
                    prod_price: prod_price
                    prod_disc: prod_disc
                    prod_init_price: prod_init_price
                    prod_sku: prod_sku
                    prod_image: prod_image

                    // ... you need to apply this also to your mouse area stuff
}

我认为您不需要

defineTemp（）

，因为您需要检查字符串是否为空。如果为空，请将其替换为对我来说毫无意义的空字符串。

非常感谢@DuKes0mE

我已将代码更改如下：

关于代表项目：

Component{
            id: delegate_item_view
            GroceryItemView{
                id: item_view
                prod_name: prod_name_
                prod_price: prod_price_
                prod_disc: prod_disc_
                prod_init_price: prod_init_price_
                prod_sku: prod_sku_
                prod_image: prod_image_
                prod_image_qr: prod_image_qr_

                MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        abc.counter = timer_value
                        my_timer.restart()
                        item_view.prod_image_vis = false
                        item_view.prod_image_qr_vis = true
                        item_view.text_click = false
                        item_view.prod_price_vis = false
                        item_view.prod_sku_vis = true
                    }
                    onDoubleClicked: {
                        item_view.prod_image_vis = true
                        item_view.prod_image_qr_vis = false
                        item_view.text_click = true
                        item_view.prod_price_vis = true
                        item_view.prod_sku_vis = false
                    }
                }
            }

关于js函数：

 function parseDataProduct(){
    //Undefined the gridview model
    gridview.model = undefined
    if(!groceryItem_listModel.count){
        var items = JSON.parse(grocery_prod_list)
        for(var x in items) {
            var show_prod_name = items[x].name
            var show_prod_price = insert_flg(items[x].total)
            var show_prod_disc = "Disc: " + insert_flg(items[x].discount)
            var show_prod_init_price = insert_flg(items[x].price)
            var show_prod_sku = items[x].sku
            var show_prod_image = items[x].image.replace(urlPath1,urlPath2)
            var show_prod_image_qr = items[x].qrcode.replace(urlPath1,urlPath2)
            //Appending Product Items
            groceryItem_listModel.append({"prod_name_": show_prod_name,
                                             "prod_price_":show_prod_price,
                                             "prod_disc_": show_prod_disc,
                                             "prod_init_price_": show_prod_init_price,
                                             "prod_sku_": show_prod_sku,
                                             "prod_image_": show_prod_image,
                                             "prod_image_qr_": show_prod_image_qr})
        }
    }else{
        return
    }
    //Re-define the gridview model
    gridview.model = groceryItem_listModel
}

}

现在一切都很好

---

并不是所有的代码都与您的问题相关。您本可以减少它。控制台中打印的值都不同。@DuKes0mE:O我明白了，您可以检查一下减少值吗。我相信您的委托中有错误。正如您在JSON中看到的，它只显示整个JSON语句中的最后一个产品，而不是thr全部。可能是因为您在完成委托时调用了

defineTemp（）

。为什么不将其声明为

prod\u name:show\u prod\u name

Hi@DuKes0mE:是的，我尝试了您的建议，但仍然保持不变…所有值都指向最后一个JSON值。。。

 function parseDataProduct(){
    //Undefined the gridview model
    gridview.model = undefined
    if(!groceryItem_listModel.count){
        var items = JSON.parse(grocery_prod_list)
        for(var x in items) {
            var show_prod_name = items[x].name
            var show_prod_price = insert_flg(items[x].total)
            var show_prod_disc = "Disc: " + insert_flg(items[x].discount)
            var show_prod_init_price = insert_flg(items[x].price)
            var show_prod_sku = items[x].sku
            var show_prod_image = items[x].image.replace(urlPath1,urlPath2)
            var show_prod_image_qr = items[x].qrcode.replace(urlPath1,urlPath2)
            //Appending Product Items
            groceryItem_listModel.append({"prod_name_": show_prod_name,
                                             "prod_price_":show_prod_price,
                                             "prod_disc_": show_prod_disc,
                                             "prod_init_price_": show_prod_init_price,
                                             "prod_sku_": show_prod_sku,
                                             "prod_image_": show_prod_image,
                                             "prod_image_qr_": show_prod_image_qr})
        }
    }else{
        return
    }
    //Re-define the gridview model
    gridview.model = groceryItem_listModel
}