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

Question

我正在寻找一个修复方法，让Material Design Light与 MyBB 一起使用，它使用SCEditor，一个 JS WYSIWYG 编辑器。存在冲突，因为 MDL 添加了破坏编辑器文本框的布局类。在 Github，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 移动到事件处理程序中将是更好的解决方案。