如何跟踪复用的GenericComponent实例并保存其Popup可见状态？

针对你的需求——在应用会话内保存GenericComponent每个实例的showElement状态，重启应用后不保留，且支持多实例复用与动态创建销毁，提供以下几种实用方案：

方案一：自定义实例ID + C++内存态单例管理器 #

给每个GenericComponent实例分配唯一ID，用C++单例类在内存中存储每个实例的状态，组件创建时恢复状态，销毁时移除记录。

步骤1：实现C++状态管理器 #

#include <QObject>
#include <QMap>

class ComponentStateManager : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QMap<QString, bool> states READ states NOTIFY statesChanged)

public:
    static ComponentStateManager* instance() {
        static ComponentStateManager inst;
        return &inst;
    }

    QMap<QString, bool> states() const { return m_states; }

    Q_INVOKABLE void setState(const QString& id, bool value) {
        m_states[id] = value;
        emit statesChanged();
    }

    Q_INVOKABLE bool getState(const QString& id) {
        return m_states.value(id, false);
    }

    Q_INVOKABLE void removeState(const QString& id) {
        m_states.remove(id);
        emit statesChanged();
    }

signals:
    void statesChanged();

private:
    ComponentStateManager() = default;
    QMap<QString, bool> m_states;
};

在main.cpp中注册这个单例到QML上下文：

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include "ComponentStateManager.h"

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    qmlRegisterSingletonInstance("com.example.state", 1, 0, "ComponentStateManager", ComponentStateManager::instance());

    const QUrl url(u"qrc:/main.qml"_qs);
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);
    engine.load(url);

    return app.exec();
}

步骤2：修改GenericComponent.qml #

添加唯一instanceId属性，在组件创建/销毁时与管理器交互：

Item {
    id: root
    property bool showElement: false
    property string instanceId: "generic-comp-" + Math.random().toString(36).substring(2, 10)

    SometimesVisible {
        visible: root.showElement
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            root.showElement = !root.showElement
            ComponentStateManager.setState(root.instanceId, root.showElement)
        }
    }

    Component.onCompleted: {
        root.showElement = ComponentStateManager.getState(root.instanceId)
    }

    Component.onDestruction: {
        ComponentStateManager.removeState(root.instanceId)
    }
}

若需父组件指定唯一ID（比如根据页面位置），直接在使用时赋值：

GenericComponent {
    instanceId: "settings-page-comp-1"
}

方案二：父级上下文存储状态（纯QML实现） #

如果不想编写C++代码，可利用父组件的内存变量存储子组件状态，适合组件在固定容器内复用的场景。

修改父组件（页面或容器） #

Item {
    id: parentContainer
    property var componentStates: ({})

    // 动态创建组件示例
    Loader {
        id: dynamicLoader
        source: "GenericComponent.qml"
        onLoaded: {
            item.instanceId = "dynamic-comp-" + Math.random().toString(36).substring(2, 10)
            item.showElement = parentContainer.componentStates[item.instanceId] ?? false
        }
        onUnloaded: {
            if (item && item.instanceId) {
                parentContainer.componentStates[item.instanceId] = item.showElement
            }
        }
    }

    // 静态复用组件示例
    GenericComponent {
        instanceId: "static-comp-1"
        Component.onCompleted: {
            showElement = parentContainer.componentStates[instanceId] ?? false
        }
        onClicked: {
            parentContainer.componentStates[instanceId] = showElement
        }
    }
}

同时修改GenericComponent.qml的onClicked事件，同步状态到父级：

MouseArea {
    anchors.fill: parent
    onClicked: {
        root.showElement = !root.showElement
        if (parent && parent.componentStates) {
            parent.componentStates[root.instanceId] = root.showElement
        }
    }
}

方案三：利用QML附加属性绑定状态 #

创建附加属性组件专门处理状态存储与恢复，实现组件与状态逻辑解耦：

实现StateSaver.qml附加属性 #

pragma Singleton
import QtQuick 2.15

QtObject {
    id: saver
    property var states: ({})

    property string instanceId
    property bool savedState

    attachedProperty: Item {
        id: attached
        property string instanceId: "saver-" + Math.random().toString(36).substring(2, 10)
        property bool savedState: saver.states[instanceId] ?? false

        onSavedStateChanged: {
            saver.states[instanceId] = savedState
        }

        Component.onDestruction: {
            delete saver.states[instanceId]
        }
    }
}

在qmldir文件中注册单例：

singleton StateSaver 1.0 StateSaver.qml

修改GenericComponent.qml使用附加属性 #

import QtQuick 2.15
import "."

Item {
    id: root
    property bool showElement: StateSaver.savedState

    SometimesVisible {
        visible: root.showElement
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            root.showElement = !root.showElement
            StateSaver.savedState = root.showElement
        }
    }

    StateSaver.instanceId: "generic-comp-" + Math.random().toString(36).substring(2, 10)
}

内容的提问来源于stack exchange，提问作者Asda Tanvir