Vaadin集成Quill编辑器：保存时无法获取当前内容的问题求助

各位大佬好！我最近在给Vaadin应用集成Quill编辑器的时候踩坑了——每次修改编辑器内容后点击保存，拿到的居然都是上一次的旧内容，完全获取不到当前编辑的最新内容，愁死我了😩

我试过用CompletableFuture配合executeJs来获取编辑器内容，但效果一直不对：保存新内容时setValue确实被调用了，可futureContent.get()返回的居然是null。更奇怪的是，我在JS代码里加了console.log，明明能看到JS那边是可以正确拿到当前编辑器的最新内容的，但就是没法把这个内容传到Java代码里。

下面是我的相关代码，麻烦大家帮我看看哪里出问题了：

Java组件代码 #

@JsModule("./js/quill.js")
public class QuillEditor extends AbstractSinglePropertyField<QuillEditor, String> {

    public QuillEditor() {
        super("value", "", false);
        getElement().executeJs("createQuillEditor($0)", getElement());
        getElement().addEventListener("text-change", event ->
                fireEvent(new ComponentValueChangeEvent<>(this, this, getEmptyValue(), false)));
    }

    @Override
    public String getValue() {
        CompletableFuture<String> futureContent = new CompletableFuture<>();
        ui.access(() -> {
            PendingJavaScriptResult pendingResult = getElement().executeJs("return getHtmlContent($0)", getElement());
            pendingResult.then(jsonValue -> futureContent.complete(jsonValue.asString()));
        });
        try {
            return futureContent.get();
        } catch (InterruptedException e) {
            e.printStackTrace();
        } catch (ExecutionException e) {
            throw new RuntimeException(e);
        }
        return null;
    }

    @Override
    public void setValue(String htmlContent) {
        getElement().executeJs("setQuillEditorHtmlContent($0, $1)", getElement(), htmlContent);
    }
}

Quill相关JS代码（quill.js） #

window.createQuillEditor = function (element) {
    const quill = new Quill(element, {
        theme: 'snow',
        modules: {
            // 此处省略模块配置细节
        }
    });
};

window.getHtmlContent = function (element) {
    const quill = Quill.find(element);
    console.log('Current content:', quill.root.innerHTML);
    return quill.root.innerHTML;
};

window.setQuillEditorHtmlContent = function (element, htmlContent) {
    const quill = Quill.find(element);
    quill.setContents(quill.clipboard.convert(htmlContent));
    console.log('HTML Content:', quill.root.innerHTML);
};

绑定代码 #

在另一个类里，我做了这样的字段绑定：

binder.forField(quillEditor).bind(CustomTextblock::getContent, CustomTextblock::setContent);

有没有大佬做过Vaadin和Quill编辑器的集成，或者能帮我分析下问题出在哪？怎么才能让Java代码正确拿到编辑器的最新内容？万分感谢！

备注：内容来源于stack exchange，提问作者ThiefCode