Question

我试图确定QML中功能范围的细节。文档中的示例似乎经常是不正确的（或不完整）。我将从JavaScript Host Environment doc page开始采用一个非常典型的例子。我使用的是Qt 5.3。

Item {
   width: 200; height: 100
   function mouseAreaClicked(area) {
       console.log("Clicked in area at: " + area.x + ", " + area.y);
   }
   // This will not work because this is undefined
   MouseArea {
       height: 50; width: 200
       onClicked: mouseAreaClicked(this)
   }
   // This will pass area2 to the function
   MouseArea {
       id: area2
       y: 50; height: 50; width: 200
       onClicked: mouseAreaClicked(area2)
   }
}

如果我把它粘贴到根ApplicationWindow对象内的一个新的空项目中，它就不起作用了。我见过很多像这样的例子，它们都表现得一样。对函数mouseAreaClicked（）的调用会生成参考错误。我可以向上移动该函数，使其直接位于根对象内部，或者我可以分配一个id并通过id调用该函数。

这是怎么回事？函数只有在它们是根对象的一部分时才可用吗？这最近发生了什么变化？它是否与ApplicationWindow对象相关联？我在文档中找不到任何相关内容。此示例也有点有趣，因为正在讨论的主题： this 指针，并不像所描述的那样表现。第一个MouseArea调用的代码与第二个MouseArea调用的代码一样，所以我也不确定该怎么做。

有任何见解。

Answer 1

我认为这就是'处理单位'的定义。当您粘贴一些旨在驻留在file.qml中的代码时，可能（稍后我将检查） - 然后打算（重新）定义一个有点自治的组件 - 您更改嵌套范围，并且 - 我从您报告的示例中推断出，和我的经验 - 只有root'属性在深层嵌套级别中是不可见的。到目前为止，我已经测试过显而易见的“明确资格”

...
  MouseArea {
       id: area2
       y: 50; height: 50; width: 200
       onClicked: parent.mouseAreaClicked(area2)
   }
...

按预期工作。也许他们应该考虑您的问题，并更正示例代码，或解释为什么您不应该复制/粘贴该代码段。总的来说，我发现你的问题是合理的。

FWIW，我有代码 - 在派生的QML组件内部 - 调用我放在应用程序根目录中的实用程序。这是我的实用程序

- 主档

ApplicationWindow {
    ...
    // utility to assign multiple members by name
    function assign(target, source) {
        for (var k in source)
            target[k] = source[k]
    }
    ...
}

- 组件文件

MouseArea {

    ...
    anchors.fill: parent
    drag.target: dr

    onClicked: {
        //console.log("onClicked")
        var i = {x:mouse.x, y:mouse.y, visible:true, width:10, height:10}
        assign(dr, i)
        assign(area, i)
    }
    ...
 }

QML中JavaScript函数范围的规则定义在哪里？

1 个答案: