如何在自定义组件中声明类型为 EventHandler（插槽？）的 属性 并在其使用中为其分配函数

Question

对于我的自定义 window，如 所示，我创建了一个名为 PathButton

的组件

import QtQuick 2.0
import QtQuick.Shapes 1.12

Item {
    property alias pathData: svg.path
    width: 24
    height: 24
    Shape {
        ShapePath {
            fillColor: "black"
            PathSvg {
                id: svg
                path: pathData
            }
        }
    }
}

并将其用于 minimize、maximize 和 close window，如下所示：

RowLayout{
    Layout.preferredWidth: 100
    anchors.right: title.right
    PathButton{
        pathData: ViewModel.minimizeIcon
        MouseArea{
            anchors.fill: parent
            onClicked: mainWindow.showMinimized()
        }
    }
    PathButton{
        pathData: ViewModel.maximizeIcon
        MouseArea{
            anchors.fill: parent
            //this doesn't restore the window to its Normal state, showMaximized() is called always
            onClicked: mainWindow.Maximized? mainWindow.showNormal() : mainWindow.showMaximized()
        }
    }
    PathButton{
        pathData: ViewModel.closeIcon
        MouseArea{
            anchors.fill: parent
            onClicked: mainWindow.close()
        }
    }
}

在所有这些中我有 MouseArea。我想要的是在我的自定义组件中拥有 MouseArea 并声明类型 eventhandler/signal/slot 的 属性 并为 onClicked 分配该处理程序，如下所示：

import QtQuick 2.0
import QtQuick.Shapes 1.12

Item {
    property alias pathData: svg.path
    property alias handler: mouse.onClicked
    width: 24
    height: 24
    Shape {
        ShapePath {
            fillColor: "black"
            PathSvg {
                id: svg
                path: pathData
            }
        }
    }
    MouseArea{
        id: mouse
        anchors.fill: parent
        onClicked: handler
    }
}

在它的使用中我想像这样分配相关函数：

PathButton{
    pathData: ViewModel.minimizeIcon
    handler: mainWindow.showMinimized()
}

编辑

这是我在 PathButton.qml 中的内容：

import QtQuick 2.0
import QtQuick.Shapes 1.12

Item {
    id: root
    property alias pathData: svg.path
    signal onClicked()

    width: 24
    height: 24
    Shape {
        ShapePath {
            fillColor: "black"
            PathSvg {
                id: svg
                path: pathData
            }
        }
    }
    MouseArea{
        anchors.fill: parent
        onClicked: root.onClicked()
    }
}

并且在 main.qml 中我得到了那个错误，当我用那个错误点击 运行 时，在应用程序输出中我得到了另一个错误：

Answer 1

我想你要找的只是一个信号：

// PathButton.qml
Item {
    id: root
    signal clicked()

    ...

    MouseArea {
        onClicked: root.clicked()
    }
}

然后你会像这样使用它：

PathButton {
    onClicked: mainWindow.showMinimized()
}