Magnolia EE 5.6.11页面详情页iframe切换的节点检测与组件问题

我之前在Magnolia 5.x的项目里也遇到过类似的子应用上下文同步问题，结合你的场景，给你几个针对性的解决方案：

问题根源分析 #

当通过页面模板超链接切换iframe时，PagesEditorSubApp#updateNodePath会触发VersionSelector#setCurrentVersion，但此时新节点的上下文还没完全初始化完成，导致VersionSelector绑定的还是旧节点的版本数据。而pageEditorPresenter.refresh()在这个场景下只是触发了UI层面的刷新，没有重新绑定新节点的数据上下文，所以监听器依然指向旧节点。

解决方案 #

1. 监听节点变更事件，同步VersionSelector上下文 #

Magnolia的PagesEditorPresenter会在节点切换时发布节点变更事件，我们可以给VersionSelector注册这个事件的监听器，确保每次节点切换时都重新加载新节点的版本数据：

// 在VersionSelectorViewImpl的construct方法中添加
PagesEditorPresenter presenter = getPagesEditorPresenter();
presenter.addNodeChangeListener(new NodeChangeListener() {
    @Override
    public void onNodeChange(Node newNode) {
        // 确保在UI线程执行更新
        UI.getCurrent().access(() -> {
            isSettingValue = true;
            // 加载新节点的版本列表
            List<Version> versions = getNodeVersions(newNode);
            versionSelector.setItems(versions);
            // 设置当前节点的活跃版本
            versionSelector.setValue(getCurrentActiveVersion(newNode));
            isSettingValue = false;
        });
    }
});

// 辅助方法：获取当前PagesEditorPresenter实例
private PagesEditorPresenter getPagesEditorPresenter() {
    // 通过Vaadin的组件树找到PagesEditorSubApp的presenter，或者依赖注入
    SubApp currentSubApp = MgnlContext.getSubAppContext().getSubApp();
    if (currentSubApp instanceof PagesEditorSubApp) {
        return ((PagesEditorSubApp) currentSubApp).getPresenter();
    }
    return null;
}

这样每次节点切换时，VersionSelector都会自动同步新节点的版本数据，避免使用旧值。

2. 修正setCurrentVersion的执行时机 #

在PagesEditorSubApp#updateNodePath中，不要直接调用setCurrentVersion，而是等待iframe加载完成后再执行。因为iframe切换完成后，新节点的上下文才完全就绪：

// 修改PagesEditorSubApp#updateNodePath中的逻辑
iframe.addLoadListener(e -> {
    // iframe加载完成后，再更新VersionSelector
    versionSelector.setCurrentVersion(getCurrentNode().getVersion());
});

如果无法直接修改PagesEditorSubApp的代码，也可以在VersionSelector中监听iframe的加载事件，通过UI组件树找到对应的iframe元素。

3. 替换refresh()为手动重新初始化版本数据 #

pageEditorPresenter.refresh()的粒度太粗，我们可以直接手动重新加载当前节点的版本数据并更新VersionSelector：

// 在需要刷新的地方调用这个方法
private void refreshVersionSelector() {
    Node currentNode = getCurrentEditorNode();
    if (currentNode == null) {
        versionSelector.setVisible(false);
        return;
    }
    isSettingValue = true;
    List<Version> versions = getNodeVersions(currentNode);
    versionSelector.setItems(versions);
    versionSelector.setValue(getCurrentActiveVersion(currentNode));
    versionSelector.setVisible(true);
    isSettingValue = false;
}

// 辅助方法：获取当前编辑的节点
private Node getCurrentEditorNode() {
    PagesEditorPresenter presenter = getPagesEditorPresenter();
    return presenter != null ? presenter.getCurrentNode() : null;
}

调用这个方法代替pageEditorPresenter.refresh()，确保VersionSelector的数据完全和当前节点同步。

另外，记得在valueChange方法中加上isSettingValue的判断，避免程序自动设置值时触发业务逻辑：

@Override
public void valueChange(Property.ValueChangeEvent event) {
    if (!isSettingValue && listener != null) {
        listener.versionSelected((Object) event.getProperty().getValue());
    }
}

内容的提问来源于stack exchange，提问作者Ana Sustic