我正在处理一些应用程序设置QML Window，这里是极简主义的工作代码：
import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.1
import QtQuick.Window 2.2
import QtQuick.Controls.Styles 1.4
Window
{
width: 512
height: 512
flags: Qt.FramelessWindowHint
visible: true
ColumnLayout
{
anchors.fill: parent
spacing: 8
Rectangle
{
Layout.fillWidth: true
Layout.fillHeight: true
Layout.margins: 8
radius: 16
border.color: "#4682b4"
border.width: 1
antialiasing: true
gradient: Gradient
{
GradientStop
{
position: 0
color: "#636363"
} // GradientStop
GradientStop
{
position: 1
color: "#303030"
} // GradientStop
} // Gradient
ColumnLayout
{
anchors.fill: parent
RowLayout
{
spacing: 8
Layout.fillWidth: true
Layout.fillHeight: true
Layout.margins: 8
Layout.alignment: Qt.AlignHCenter|Qt.AlignTop
antialiasing: true
Text
{
text: qsTr("APPLICATION SETTINGS")
clip: true
font.bold: true
font.pointSize: 24
textFormat: Text.RichText
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
} // Text
} // RowLayout
ColumnLayout
{
Layout.fillWidth: true
Layout.fillHeight: true
Layout.margins: 8
Layout.alignment: Qt.AlignHCenter|Qt.AlignBottom
TabView
{
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter
frameVisible: true
Tab
{
asynchronous: true
title: qsTr("Database")
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter
ColumnLayout
{
spacing: 8
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter
TextField
{
id: textFieldServerAddress
antialiasing: true
Layout.fillWidth: true
Layout.fillHeight: false
placeholderText: qsTr("database server address")
} // TextField
TextField
{
id: textFieldServerPort
Layout.fillWidth: true
Layout.fillHeight: false
placeholderText: qsTr("database server port")
} // TextField
TextField
{
id: textFieldDatabaseName
Layout.fillWidth: true
Layout.fillHeight: false
placeholderText: qsTr("database name")
} // TextField
TextField
{
id: textFieldDatabaseUsername
Layout.fillWidth: true
Layout.fillHeight: false
placeholderText: qsTr("database access username")
} // TextField
TextField
{
id: textFieldDatabasePassword
Layout.fillWidth: true
Layout.fillHeight: false
placeholderText: qsTr("database access password")
echoMode: TextInput.PasswordEchoOnEdit
} // TextField
RowLayout
{
Layout.fillWidth: true
Layout.fillHeight: false
Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter
spacing: 8
Button
{
Layout.fillWidth: false
Layout.fillHeight: true
Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter
text: qsTr("Test Connection")
onClicked:
{
print(textFieldServerAddress.text+
textFieldServerPort.text+
textFieldDatabaseName.text+
textFieldDatabaseUsername.text+
textFieldDatabasePassword.text);
} // onClicked
} // Button
} // RowLayout
} // ColumnLayout
} // Tab
Tab
{
asynchronous: true
title: qsTr("General")
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter
} // Tab
} // TabView
RowLayout
{
Layout.fillWidth: true
Layout.fillHeight: false
Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter
spacing: 8
Button
{
Layout.fillWidth: false
Layout.fillHeight: true
Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter
text: qsTr("Apply")
onClicked:
{
print(textFieldServerAddress.text+
textFieldServerPort.text+
textFieldDatabaseName.text+
textFieldDatabaseUsername.text+
textFieldDatabasePassword.text);
} // onClicked
} // Button
Button
{
Layout.fillWidth: false
Layout.fillHeight: true
Layout.alignment: Qt.AlignLeft|Qt.AlignVCenter
text: qsTr("Clear")
onClicked:
{
textFieldServerAddress.text="";
textFieldServerPort.text="";
textFieldDatabaseName.text="";
textFieldDatabaseUsername.text="";
textFieldDatabasePassword.text="";
} // onClicked
} // Button
} // RowLayou
} // ColumnLayout
} // ColumnLayout
} // Rectangle
} // ColumnLayout
} // Window
正如你所看到的，我有三个Button：
- 测试连接
- 应用
- 清除
现在，如果我填充值并单击TestConnectionButton，就会执行处理程序onClicked()中的代码。但是，如果我点击Button s应用或清除，我会得到以下错误：
ReferenceError: textFieldServerAddress is not defined
Wtf，我为什么会出现这个错误，我该如何消除它？关于Button的名称，在测试连接中，我使用输入的参数测试数据库连接，在
应用中将数据库连接参数保存到SQLITE数据库中，在TextField实体中的所有值。
来自文档：
组件作用域是组件内对象ID和组件根对象属性的并集。
此外，我们从这里发现：
选项卡项继承自Loader，并提供类似的API。
因此，您的项目本身就是一个组件范围，具有自己的规则和可见性。这是因为Loader加载的项目不是周围范围的一部分，相反，它对它的访问权限有限（主要是通过Loader本身公开和可用的内容）。
这就是为什么id在一个按钮中可见，但在选项卡中的其他按钮中却看不到。
您必须重构UI，或者至少要将符号导出到可访问的对象中。