Как получить страницу сведений об одном элементе со страницы просмотра списка, используя QML?

Question

Этот код страницы списка находится здесь

import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

Item {

    ListModel {
        id: mymodel
            ListElement {
                name: 'Jack'
                age: 30
                rank: 'Captain'
            }
            ListElement {
                name: 'Barbossa'
                age: 23
                rank: 'Sailor'
            }
            ListElement {
                name: 'Philip'
                age: 19
                rank: 'Sergent'
            }
        }
    ListView {
        id: list
        width: parent.width
        height: parent.height
        anchors.centerIn: parent
        spacing: 10
        model: mymodel
        delegate: Rectangle {
            // property variant myData: model
            width: parent.width
            height: 20
            color: 'Blue'
            Text {
                anchors.centerIn: parent
                color: 'white'
                text: 'Name: ' + name + ', Age: ' + age
                font.pointSize: 20
            }
            MouseArea {
                    anchors.fill: parent
                    onClicked: list.currentIndex = index
                }
            Button {
                    width: 50
                    height: parent.height
                    anchors.right: parent.right
                    text: ">"

                    onClicked: {
                    list.currentIndex = index
                    mystackview.push(third_page);
                    }
                }
        }
    }
}

Вот изображение после запуска

Другая кодовая страница после нажатия следующей стрелки, чтобы получить один элемент подробно

import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

Item {    
    Rectangle {
         width: parent.width
            height: 20
            color: 'red'
            ListView {
                 model: model
            }
            Text {
                anchors.centerIn: parent
                color: 'white'
                text: 'Name: ' + ListModel.model.name 
                font.pointSize: 20
            }
    }
}

Но эта ошибка показывает

Ошибка типа: невозможно прочитать свойство 'имя' из неопределенного)

Какое решение для этого

Answer 1

Код ListModel.model.name не имеет смысла, поскольку ListModel, являющийся компонентом (классом), не имеет этого свойства. В этом случае лучше создать свойство, которое обрабатывает currentIndex между страницами, и модель используется напрямую.

main.qml

import QtQuick 2.9
import QtQuick.Controls 2.2

ApplicationWindow {
    id: window
    visible: true
    width: 640
    height: 480
    title: qsTr("Stack")

    ListModel {
        id: mymodel
        ListElement {
            name: 'Jack'
            age: 30
            rank: 'Captain'
        }
        ListElement {
            name: 'Barbossa'
            age: 23
            rank: 'Sailor'
        }
        ListElement {
            name: 'Philip'
            age: 19
            rank: 'Sergent'
        }
    }

    QtObject{
        id: internals
        property int currentIndex: -1
    }

    StackView {
        id: stackView
        anchors.fill: parent
        initialItem: "TodoView.qml"
    }
}

TodoView.qml

import QtQuick 2.9
import QtQuick.Controls 2.2

Item {
    ListView {
        id: list
        model: mymodel
        anchors.fill: parent
        spacing: 10
        delegate: Rectangle {
            width: parent.width
            height: 20
            color: 'Blue'
            Text {
                anchors.centerIn: parent
                color: 'white'
                text: 'Name: ' + name + ', Age: ' + age
                font.pointSize: 20
            }
            MouseArea {
                anchors.fill: parent
                onClicked: list.currentIndex = index
            }
            Button {
                width: 50
                height: parent.height
                anchors.right: parent.right
                text: ">"
                onClicked: {
                    list.currentIndex = index
                    internals.currentIndex = index
                    stackView.push("DetailView.qml")
                }
            }
        }
    }
}

DetailView.qml

import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

Item {
    Rectangle {
        width: parent.width
        height: 20
        color: 'red'
        Text {
            anchors.centerIn: parent
            color: 'white'
            text: 'Name: ' + mymodel.get(internals.currentIndex).name
            font.pointSize: 20
        }
    }
}