Call function from ancestor. How?

[bogong]

Hello!

Trying to create template QML object, something like this Template.qml:

Rectangle {

	id: oRoot;
	color: "magenta";

	MouseArea {

		id: oMouseArea;
		anchors.fill: parent;

		onClicked: {

			console.debug("Template OnClicked");

			if ("mOnClicked" in parent) {
				if (typeof parent.mOnClicked === "function") {
					parent.mOnClicked();
				} else {
					console.debug("not a function");
				}
			} else {
				console.debug("no method");
			}
		}		
	}
}

This template should have mechanism to check if ancestor of this template has function, then call it. For now it's not working if there are created some component ComponentBasedOnTemplate.qml

// Component
Template {

    id: oRoot;
  
    function mOnClicked() {

        console.debug( "Component onClicked");
    }
}

How to make accessible ComponentBasedOnTemplate JS functions from Template?

[GrecKo]

The usual way to do this is to declare a signal in the root of your Template and then connect to it when using the type.

So in Template.qml:

Rectangle {
    id: oRoot
    signal clicked()
    // ...
    MouseArea {
        onClicked: oRoot.clicked()
        // ...

And then in ComponentBasedOnTemplate.qml:

Template {
    onClicked: console.debug( "Component onClicked")
}

I'll advise you to just use Button or another higher level type provided by Qt Quick Controls though.