【QML】鼠标放在控件上颜色改变的效果实现

最近刚好要用到一个功能，在qml上实现鼠标放上去，控件的颜色改变，鼠标移走，控件颜色恢复。第一反应是这个功能非常简单，但是搞了一会儿都没实现，最后发现MouseArea其实提供了一个很简便的方法来提供使用，这里做个记录：

ListView {
        height:parent.height;
        width:100;
        model:["测试1","测试2","测试3"];
        delegate: Rectangle{
            id:rect;
            height:40;
            width: 100;
            color: "grey";
            Text {
                anchors.centerIn: parent;
                text: modelData;
            }

            MouseArea{
                anchors.fill: parent;
                hoverEnabled: true;
                onEntered: {    //鼠标移入
                    rect.color = "orange";
                }
                onExited: {
                    rect.color = "grey";
                }
            }
        }
    }

效果图如下：