Vue 和 TinyMCE 问题

Question

我正在尝试将 TinyMCE 编辑器集成到我的 Vue 应用程序中。从开发人员工具控制台，我能够访问 tinymce 对象并对其进行操作。例如：

tinymce.activeEditor.selection.setContent('I am a replacement')

以上代码将替换 TinyMCE 编辑器中的选定文本。我想在 Vue 中（在多个组件中）使用 tinymce 对象，但我不确定如何访问它。当我将上述代码输入函数时，我得到的确切错误是：error 'tinymce' is not defined no-undef。

如有任何帮助，我们将不胜感激。谢谢。

Answer 1

在没有看到任何代码的情况下，很难确切地说出为什么会发生这种情况。记录您如何实例化 TinyMCE 会有所帮助。

根据错误消息，我假设您正在使用 TinyMCE Vue component/wrapper 将 TinyMCE 注入到您的 Vue 组件中。默认情况下，直到运行时间才真正加载核心 TinyMCE 编辑器 - 那时它通过 TinyMCE 云服务器加载东西。

您看到的错误是您的 linting 工具 (eslint?) 抱怨您正在尝试调用变量 tinymce 但该变量未在任何地方定义。

您可以选择"fix" eslint 投诉的几种方式：

1 - 通过全局 window 对象访问 tinymce：

window.tinymce

2 - 使用 eslint 指令包装您的代码以不检查未定义的变量：

/*eslint-disable no-undef*/
...
/*eslint-enable no-undef*/

3 - 在 .eslintrc 文件中定义一个全局变量

{
  "globals": {
    "tinymce": true
  }
}

Vue and TinyMCE Issue