Javascript 单击时从React Quill内容元素节点更新React应用程序状态

我想允许React羽毛笔编辑器主体中的特定元素在单击时更新应用程序上下文

我怎么做

这是我做的自定义污渍：

/* Mention blot config
====================== */
class MentionBlot extends BlockEmbed {
  static create(data) {
    const node = super.create();
    const denotationChar = document.createElement("span");
    denotationChar.className = "ql-mention-denotation-char";
    denotationChar.innerHTML = data.denotationChar;
    node.appendChild(denotationChar);
    node.innerHTML += data.value;
    return MentionBlot.setDataValues(node, data);
  }

  static setDataValues(element, data) {
    const domNode = element;
    Object.keys(data).forEach((key) => {
      domNode.dataset[key] = data[key];
    });
    return domNode;
  }

  static value(domNode) {
    return domNode.dataset;
  }
}

MentionBlot.blotName = "mentionCustom";
MentionBlot.tagName = "span";
MentionBlot.className = "mention";

Quill.register("formats/mentionCustom", MentionBlot);

以下是它的呈现方式：

谢谢：）