Access QML StackView from a control

Question

Sorry for probably a stupid question - I'm very new to QML.

One of my StackView's pages:

Page
{
    id : root

    header: ToolBar
    {   
        BackButton
        {
            anchors.left: parent.left
        }
    }
}

BackButton code:

Button
{
    text: "<"
    font.pixelSize: 20
    width: 30
    onClicked: parent.root.StackView.view.pop()
}

I've tried parent.StackView also. No luck. Getting:

TypeError: Cannot call method 'pop' of null

Is there a solution?

Answer 1

1. There is some sort of bug in Qt or Visual Studio 2015. Full rebuild is required generally after some modifications made to QML.
2. root.StackView.view.pop() is the correct one.

Answer 2

I'd suggest something like this.

main.qml:

import QtQuick 2.6
import QtQuick.Controls 2.0

StackView {
    id: stackView
    initialItem: Page {
        header: ToolBar {
            BackButton {
                anchors.left: parent.left
                view: stackView
            }
        }
    }
}

BackButton.qml:

import QtQuick 2.6
import QtQuick.Controls 2.0

Button {
    property StackView view
    text: "<"
    font.pixelSize: 20
    width: 30
    onClicked: view.pop()
}

This way, you are not relying on an id from outside the component. Instead, you pass in the instance you want the BackButton to operate on - this is much less fragile when refactoring in the future.