How to delete QML object

Question

I am trying to delete QML object and recreate object like this：

Rectangle{
    property var obj

    signal videoStopped(variant complete)

    function recreate(url){
        if(!obj){
            console.log("createObject")
            obj = videoComponet.createObject(root)
            obj.stopped.connect(function(){
                videoStopped(obj.status == MediaPlayer.EndOfMedia)
            })
        }
        obj.source = url
        obj.play()
    }
    function stop(){
        obj.destroy() // obj.deleteLater()
    }
    Component{
        id: videoComponet
        Video {
            anchors.fill: parent
            visible: true
            autoPlay: true; autoLoad: true
        }
    }
}

C++ side call recreate to generate an object and call stop to delete it.

1. recreate ⇒ console output createObject

   ↓

2. stop

   ↓

3. recreate ⇒ console no output

Both obj.destroy() and obj.deleteLater() not worked. How to forcedly delete the dynamically created object just like delete in C++.

Answer 1

Use Loader instead.
It loads an Item dynamically and you can destroy it by setting sourceComponent property to undefined :

Loader {
    id: loader
}

Component {
    id: myDynComp
    Rectangle {
        width: 40; height: 40
        anchors.centerIn: parent
    }
}


Row {
    Button {
        width: 120; height: 40
        text: "Load"
        onClicked: {
            loader.sourceComponent = myDynComp; //load/create component dynamically
        }
    }

    Button {
        width: 120; height: 40
        text: "UnLoad"
        onClicked: {
            loader.sourceComponent = undefined; //causes destoying loaded component
        }
    }
}

Answer 2

A minor change to SMMousavi's answer : I observed that setting sourceComponent to undefined does not work. I have to set it to null to unload the component. Another option is to set the source to empty string.

onClicked: {
    loader.sourceComponent = null; //causes destroying loaded component
}

OR

onClicked: {
    loader.source = ""; //causes destroying loaded component
}