How to access attributes and methods in item of Loaders with QML

Question

I want hide the item that is loaded with loader. Unfortunately, i can't access the attribute, visible, in the Loader.item. The following code is my QML code. Any suggestion? Many thanks!

DefaultPage.qml

Rectangle {

id:root
width: 800
height: 600
focus: true

Timer {
    id:timeoutTimer
    interval: 60000;
    running: true;
    repeat: true
    onTriggered: {
        mainWidget.visible=false;
        video.opacity = 1;
    }
}

Keys.onPressed: {

    console.log(pageLoader.item.objectName.toString());
    pageLoader.item.mainWidget.visible=true;
    videoLoader.item.video.opacity = 0.1;
    timeoutTimer.restart();
    event.accepted = true;
}

Loader
{
    id:videoLoader
    source: "VideoPage.qml"
}

Loader
{
    id:pageLoader
    source:"MainMenuPage.qml"
}
}

VideoPage.qml

Video{
id:video
x: -8
y: -17
width: 800
height: 600
source: "123.mp4"
autoLoad: true
autoPlay: true
}

MainMenuPage.qml

Item{
id:mainWidget
x: 30
y: 100
width: 210
height: 160
visible: true

ListView {
    id: mainList
    x: 313
    y: 120
    width: 200
    height: 160
    currentIndex:1
    visible: parent.visible

    delegate: Item {
        width: 200
        height: 40

        Column { Text { text: name; font.pointSize: 22; color: "#FFFFFF"} }
    }

    highlight: Rectangle { color: "lightsteelblue"; radius: 5 ; opacity:0.5}

    focus: true

    model: ListModel {
        ListElement {
            name: "Barcode Input"
        }

        ListElement {
            name: "Reset"
        }

        ListElement {
            name: "Engineer Mode"
        }
    }
}
}

Answer 1

This is invalid:

videoLoader.item.video.opacity = 0.1;
pageLoader.item.mainWidget.visible=true;

You don't need add item's id. Use this instead:

videoLoader.item.opacity = 0.1;
pageLoader.item.visible=true;