如何在TabView中的GridLayout中更新或读取TextFiled

Question

我有下面的组件堆栈，我想读取和设置TextFiled的值：

-Rectangle
-----TabView
---------Tab
-----------Rectangle 
--------------GridLayout
------------------Rectangle 
--------------------TextField <--- I want to access this TextField

我也有需要在选项卡内访问Repeater的情况：

-Rectangle
-----TabView
---------Tab
-----------Rectangle 
--------------GridLayout
------------------Repeater 
--------------------TextField <--- I want to access this TextField also

我尝试使用：

var tab0 = myTabView.getTab(0);
tab0.children[0].text = "Some Text"; // I get Undefined Error 

我尝试使用Tab中的函数访问组件：

import QtQuick 2.0
import QtQuick.Controls 2.14 as QQC2
import QtQuick.Layouts 1.14
import QtQuick.Controls 1.4 as QQC1

QQC2.Item {

QQC1.TabView {

  QQC1.Tab {
    title: "tab1"

    function printValue ()  {
      console.log("myTextFld.txt: "+myTextFld.txt);  // <-- Getting Error myTextFld undefined.
    }

    Rectangle {
      id: tabHolderRext
      color: "blue"

      GridLayout {
        id: myGrid
        model: 7

        Repeater {
          id: herderRepeater
          model: header
          delegate: Rectangle {
            TextField {
              // I want to Access This TextField also 
            }
          }
        }

        Rectangle {
          id: row0Rect
          Layout.row: 0
          Layout.column: index

          TextFiled {
            id: myTextFld
            text: modelData
          }     
        }

        // Rest of the rows 
    }
    }
}
}
}

Answer 1

如果您在同一qml文件中包含所有项目，则

Item id可用于从TextField访问值。如果您有不同的qml文件，请使用alias types link访问值。

中继器情况：文本字段必须首先更新基础模型view --> model，然后我们才能使用模型的数据。

这里是示例代码。我已经将所有商品堆叠在同一个qml文件中，因此可以通过id访问此处。

import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 1.4

Window {
    visible: true
    width: 640
    height: 480

    Item {
        anchors.fill: parent
        anchors.margins: 10

        TabView {
            anchors.fill: parent
            Tab {
                title: "TextField"

                Item {
                    anchors.fill: parent
                    Grid {
                        spacing: 20
                        anchors.fill: parent
                        anchors.margins: 10
                        Rectangle {
                            height: 40
                            width: 150
                            TextField {
                                id: inputId
                                anchors.fill: parent
                                placeholderText: "enter text"
                            }
                        }

                        Button {
                            height: 40
                            width: 150
                            text: "show txt"
                            onClicked: labelId.text = inputId.text
                        }

                        Rectangle {
                            height: 40
                            width: 150
                            Label {
                                id: labelId
                                anchors.fill: parent
                                horizontalAlignment: Text.AlignHCenter
                                verticalAlignment: Text.AlignVCenter
                            }
                        }
                    }
                }
            }
            Tab {
                title: "Repeater"

                Item {
                    anchors.fill: parent
                    Grid {
                        spacing: 20
                        anchors.fill: parent
                        anchors.margins: 10
                        columns: 3

                        ListModel {
                            id: fruitModel
                            ListElement { name: "Apple" }
                            ListElement { name: "Orange" }
                            ListElement { name: "Banana" }
                        }

                        Repeater {
                            width: parent.width
                            height: parent.height / 2
                            model: fruitModel
                            delegate: Rectangle {
                                height: 40
                                width: 150
                                TextField {
                                    anchors.fill: parent
                                    text: name
                                    onTextChanged: fruitModel.setProperty(index, "name", text) // update model data
                                }
                            }
                        }

                        Repeater {
                            width: parent.width
                            height: parent.height / 2
                            model: fruitModel
                            delegate: Rectangle {
                                height: 40
                                width: 150
                                Label {
                                    text: name
                                    anchors.fill: parent
                                    horizontalAlignment: Text.AlignHCenter
                                    verticalAlignment: Text.AlignVCenter
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}