Javascript VueJS+；TinyMCE：TinyMCE仅显示一次

请尝试代码片段

我在Vue路由器中有许多组件，每个组件都有自己的TinyMCE编辑器来编辑内容。但是，TinyMCE仅为第一个加载的路由器显示。控制台中有一个错误：

访问属性“document”的权限被拒绝

，这只在我同时使用TinyMCE和Vue时发生，我不知道这是否是我的问题的原因

如果有人有解决办法，我会通知你的

我在jsfillde上有这个问题的另一个版本：。我没有在JSFIDLE上获得访问属性“document”的权限被拒绝的错误

var Foo=Vue.extend({
模板：“#foo”，
就绪：函数（）{
//这没用
//tinyMCE.remove（）
tinyMCE.init（{选择器：#tinymcefo}）
//这不起作用
//execCommand（'mceAddControl'，false，'tinymcefo'）；
//tinyMCE.execCommand（'mceAddEditor'，false，#tinymcefo'）；
}
})
var Bar=Vue.extend({
模板：“#条”，
就绪：函数（）{
//这没用
//tinyMCE.remove（）
init（{selector:#tinymcebar}）
//这不起作用
//execCommand（'mceAddControl'，false，'tinymcefo'）；
//tinyMCE.execCommand（'mceAddEditor'，false，#tinymcefo'）；
}
})
var App=Vue.extend（{}）
var router=new VueRouter（）
路由器地图({
“/foo”：{
组成部分：富
},
“/bar”：{
组件：棒
}
})
路由器重定向({
“*”：“/foo”
})
路由器启动（应用程序“#应用程序”）

菜单：工作|不工作


工作

不起作用

尝试为文本区域指定相同的类，并选择该类作为选择器：

<textarea id="tinymcefoo" class="my_editor"></textarea>
<textarea id="tinymcebar" class="my_editor"></textarea>

只初始化tinyMCE一次，您可以在应用程序开始时进行初始化

tinceMCE.init({
  mode: 'none'
});

使用Vue的ready和beforeDestroy事件在每次初始化时重新加载编辑器

var Foo = Vue.extend({
  // ...
  ready: function() {
    tinyMCE.execCommand('mceAddEditor', true, 'tinymcebar'); // id without '#'
  },
  beforeDestroy: function() {
    tinyMCE.execCommand('mceRemoveEditor', true, 'tinymcebar');
  }
}

链接到
是的，我找到了如下解决方案：

// load tinymce placeholder plugin from from local static file
tinymce.PluginManager.load('placeholder', '/static/js/tinymce/plugins/tinymce-placeholder.plugin.js');

以下是我的TinyMceComponent的完整来源：
这是可行的，但我如何才能以这种方式为TinyMCE添加配置？（例如添加或删除tinymce插件）@Robert我这一次用过，你能找到办法吗？
// load tinymce placeholder plugin from from local static file
tinymce.PluginManager.load('placeholder', '/static/js/tinymce/plugins/tinymce-placeholder.plugin.js');