javascript - 从 tinyMCE onAction 方法调用 setState 时状态未更新

Question

我正在研究 react 和 tinymce 中的图书创建者。允许用户在 Canvas 上创建多个文本 block 并用文本填充它们。

当带有用于创建新文本 block 的 onClick 方法的按钮在外部编辑器中调用时，一切正常，例如典型的 .

当我尝试添加工具栏按钮时问题开始了:

    setup: (editor) => {
        editor.ui.registry.addButton("AddNew", {
        text: "Add new",
        onAction: (buttonApi) => addTextBlock()
        });
    },

它工作一次。它通过更新状态对象来创建 textBlock 对象，但连续单击此按钮会将状态重置为初始值(空列表)并再次添加一个对象。

从放置在编辑器外部的按钮执行的相同代码正确创建了点击量的文本 block 。

我在控制台中没有错误或相关警告。

Answer 1

我也有同样的问题，然后我用以下代码解决了这个问题:

setup: (editor) => {
    let self = this;
    editor.ui.registry.addButton('customButton', {
        text: 'Button',
        tooltip: 'Insert/edit image',
        onAction: function(){
            self.setState({click:true});
        }
    });
}