Vue与TinyMCE问题

Question

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

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

上面的代码将替换TinyMCE编辑器中选定的文本。我想使用Vue内部的tinymce对象(在多个组件中)，但我不知道如何访问它。当我将上述代码输入函数时，所得到的确切错误是：错误'tinymce‘未定义为no-undef。

任何帮助都将不胜感激。谢谢。

Answer 1

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

根据错误消息，我假设您使用TinyMCE Vue组件/包装器将TinyMCE注入到Vue组件中。默认情况下，它直到运行时才实际加载核心TinyMCE编辑器，并且在那个时候它通过TinyMCE云服务器加载内容。

您看到的错误是您的衬里工具(eslint?)抱怨您试图调用变量tinymce，但该变量没有在任何地方定义。

有几种方法可以选择“修复”eslint抱怨：

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

window.tinymce

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

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

https://eslint.org/docs/user-guide/configuring#disabling-rules-with-inline-comments

3-在.eslintrc文件中定义全局

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

https://eslint.org/docs/user-guide/configuring#specifying-globals