【写在前面】

        最近在 Qml 中使用 MouseArea 时发现了一个奇怪的现象：

        位于 MouseArea 上的 ListView 在处理了滚轮事件的情况下进行滚轮，下面的 MouseArea 却在某些情况下接收到了这个事件。

        按照直觉，ListView 明明有内部的滚轮事件处理，应该阻止事件向下传递才对，然而此时的情况却出乎意料，因此在此记录并附上解决方案。

【正文开始】

        首先，我们来看一个很简单的例子：

import QtQuick 2.15
import QtQuick.Window 2.15Window {width: 640height: 480visible: truetitle: qsTr("Hello World")Rectangle {id: scaledRectwidth: 100height: 100anchors.centerIn: parentcolor: "red"}MouseArea {id: mouseArea1anchors.fill: parentonWheel: (wheel) => {if (wheel.angleDelta.y > 0) scaledRect.scale += 0.1;else if (wheel.angleDelta.y < 0) scaledRect.scale -= 0.1;print("mouseArea1 wheel event!");}}ListView {id: listViewwidth: parent.width * 0.5height: parent.height * 0.5anchors.centerIn: parentclip: truemodel: 100spacing: 5delegate: Rectangle {width: listView.widthheight: 20color: "#8000ff00"Text {anchors.centerIn: parenttext: index}}}
}

        按道理，我在最顶层的 ListView 上滚动鼠标，应当不会影响到下面的的红色方块，然而，事实并非如此：

         可以看到，某些时候我在 ListView 上滑动滚轮，底层的 MouseArea 也会接收并处理滚轮事件。

        一开始，我以为是 ListView 的 spaing 属性( 代理项的间隔 )导致滚轮事件穿透，然而去掉后并没有卵用，问题仍然没有解决。

        不管怎样，这是一个相当坑爹的 BUG( 也许不是，但至少影响到我了 )，那么必须要处理好它。

        这里我用了一点奇怪的写法，但相当有用，方法是增加一个 MouseArea 并处理其滚轮事件( 自己处理总不会穿透了吧！)：

    MouseArea {width: parent.width * 0.5height: parent.height * 0.5anchors.centerIn: parentonWheel: (wheel) => wheel.accepted = true;ListView {id: listViewanchors.fill: parentclip: truemodel: 100spacing: 5delegate: Rectangle {width: listView.widthheight: 20color: "#8000ff00"Text {anchors.centerIn: parenttext: index}}}}

        没错，将 ListView 置于一个MouseArea 内即可解决问题。

【结语】

        最后，我发现 Qt6 仍有这种情况，因此需要大家格外注意。