Question

我指的是https://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-spinbox并复制粘贴相同的代码，但我收到以下错误：

ReferenceError：未定义向下</ strong>和 ReferenceError：未定义up。

代码：

import QtQuick 2.6 import QtQuick.Controls 2.1 SpinBox { id: control value: 50 editable: true contentItem: TextInput { z: 2 text: control.textFromValue(control.value, control.locale) font: control.font color: "#21be2b" selectionColor: "#21be2b" selectedTextColor: "#ffffff" horizontalAlignment: Qt.AlignHCenter verticalAlignment: Qt.AlignVCenter readOnly: !control.editable validator: control.validator inputMethodHints: Qt.ImhFormattedNumbersOnly } up.indicator: Rectangle { x: control.mirrored ? 0 : parent.width - width height: parent.height implicitWidth: 40 implicitHeight: 40 color: up.pressed ? "#e4e4e4" : "#f6f6f6" border.color: enabled ? "#21be2b" : "#bdbebf" Text { text: "+" font.pixelSize: control.font.pixelSize * 2 color: "#21be2b" anchors.fill: parent fontSizeMode: Text.Fit horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter } } down.indicator: Rectangle { x: control.mirrored ? parent.width - width : 0 height: parent.height implicitWidth: 40 implicitHeight: 40 color: down.pressed ? "#e4e4e4" : "#f6f6f6" border.color: enabled ? "#21be2b" : "#bdbebf" Text { text: "-" font.pixelSize: control.font.pixelSize * 2 color: "#21be2b" anchors.fill: parent fontSizeMode: Text.Fit horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter } } background: Rectangle { implicitWidth: 140 border.color: "#bdbebf" } }

我应该包含任何其他进口产品吗？

Answer 1

不，您不需要包含任何其他进口商品。只是，这个例子使用了不好的做法，在这里你明白为什么：

这是示例中的（仅限于修改up.indicator）代码：

import QtQuick 2.6
import QtQuick.Controls 2.0

SpinBox {
    id: control
    value: 50
    editable: true

    up.indicator: Rectangle {
        x: control.mirrored ? 0 : parent.width - width
        height: parent.height
        implicitWidth: 40
        implicitHeight: 40
        color: up.pressed ? "#e4e4e4" : "#f6f6f6"  // <---*
        border.color: enabled ? "#21be2b" : "#bdbebf"

        Text {
            text: "+"
            font.pixelSize: control.font.pixelSize * 2
            color: "#21be2b"
            anchors.fill: parent
            fontSizeMode: Text.Fit
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
        }
    }
}

这里我们将SpinBox作为文件的根元素。

现在让我们谈谈名称解析有问题的行标有// <---*

control: up.pressed ? "..." : "..."

来自哪里？首先，它将查看使用它的对象 - Rectangle。 Rectangle没有up - 属性，因此它将继续并查看文件的根节点，即SpinBox - 这具有up - 属性，它还具有pressed的值。

当我们尝试使用它时（错误的方式），情况看起来不同。我们添加ApplicationWindow：

import QtQuick 2.7
import QtQuick.Window 2.2
import QtQuick.Controls 2.0

ApplicationWindow {
    id: window

    width: 800
    height: 600
    visible: true

    SpinBox {
        id: control
        value: 50
        editable: true

        up.indicator: Rectangle {
            x: control.mirrored ? 0 : parent.width - width
            height: parent.height
            implicitWidth: 40
            implicitHeight: 40
            color: up.pressed ? "#e4e4e4" : "#f6f6f6"
            border.color: enabled ? "#21be2b" : "#bdbebf"

            Text {
                text: "+"
                font.pixelSize: control.font.pixelSize * 2
                color: "#21be2b"
                anchors.fill: parent
                fontSizeMode: Text.Fit
                horizontalAlignment: Text.AlignHCenter
                verticalAlignment: Text.AlignVCenter
            }
        }
    }
}

相同的行 - 将尝试在up中查找Rectangle，失败并继续到文件根节点，现在是ApplicationWindow。在这里又失败了。由于ApplicationWindow未在另一个文件中使用，其中可能存在另一个文件根节点，搜索将结束并最终失败。

出了什么问题？该示例的作者错过了应用优良做法以始终使用完全限定标识符：id.property....，例如他定义x - Rectangle的值。

更改行：

color: up.pressed ? [...]

为：

color: control.up.pressed ? [...]

将解决问题，因为我们现在明确声明在哪里查找属性up。

重要课程

通过从子节点转到父节点，但始终从子节点到文件根节点等不能解析名称，直到它无法继续

始终通过parent明确标识对象（但请注意，您可能不知道父对象究竟是什么。理想情况下仅适用于锚点和位置）或对象的{{1} }}

ReferenceError：在SpinBox QML中未定义down

1 个答案: