有没有办法从外部启用/禁用SunEditor上的保存按钮？

问题描述

我在React应用程序中使用SunEditor，并且工作正常。我确实有挑剔的东西。在保存时，我将保存由SunEditor生成的文档以及有关该文档的其他元数据。 SunEditor似乎通过监视其编辑控件中的更改来控制是否在内部启用/禁用了保存按钮，这很好，但是如果当前禁用了保存按钮并且有人编辑了与我要启用保存按钮相关的文档的元数据。我浏览了文档，但似乎找不到配置设置，说“嘿，启用该保存按钮！”有办法吗？

A link to the SunEditor for React docs

A link to the javascript SunEditor docs

解决方法

您可以使用 useRef() 来标识编辑器节点，然后选择保存按钮元素并从中删除 disabled 属性。

export const YourComponent = () => {
   //...
   const editorReference = useRef(null);

   //...
   let saveElement = !R.isNil(editorReference) && !R.isNil(editorReference.current) ? editorReference.current.getElementsByClassName("se-btn _se_command_save se-resizing-enabled se-tooltip") : undefined;
   if (!R.isNil(saveElement) && saveElement.length>0){
       saveElement[0].removeAttribute("disabled");
   }

   return (
     <div>
          <div ref={editorReference}>
             <SunEditorautoFocus={true} enable={true} showToolbar={true} enableToolbar={true} />
          </div>
     </div>
   );
}