如何修复 Material Design Light - SCEditor 冲突？

Question

我正在寻找获得 Material Design Light working with MyBB which uses SCEditor, a JS WYSIWYG editor. There is a conflict because MDL adds layout classes that break the editors textbox. At Github there is a similar issue with TinyMCE 的修复程序，但我不确定如何将修复程序应用到 SCEditor。

非常感谢任何帮助，谢谢。

Answer 1

布局升级后初始化编辑器似乎解决了我的问题：

document.addEventListener('mdl-componentupgraded', function (e) {
  if (typeof e.target.MaterialLayout !== 'undefined') {
    // Create editor JS here
    $('textarea').sceditor({
      plugins: 'bbcode',
      style: 'https://cdn.jsdelivr.net/sceditor/1.5.1/jquery.sceditor.default.min.css'
      /* any other options options here */
    });
  }
});

对于 MyBB，您需要将创建编辑器的 JS 移动到事件处理程序中，以便在 MDL 升级布局后调用它。如果你不能移动 JS，你将需要删除并重新创建它的编辑器来修复它：

document.addEventListener('mdl-componentupgraded', function (e) {
  if (typeof e.target.MaterialLayout !== 'undefined') {
    // Remove any previous instance first
    $('textarea').sceditor('instance').destroy();

    // Create the editor
    $('textarea').sceditor({
      plugins: 'bbcode',
      style: 'https://cdn.jsdelivr.net/sceditor/1.5.1/jquery.sceditor.default.min.css'
      /* any other options options here */
    });
  }
});

非常难看，但应该适用于 SCE。

MDL 可能会与任何其他 JS 冲突，因此如果可以的话，将 MyBB JS 移动到事件处理程序内部将是更好的解决方案。

如何修复 Material Design Light - SCEditor 冲突？

How to fix Material Design Light - SCEditor conflict?

javascript

material-design

sceditor