Question

我正在尝试在TinyMCE中创建一个简单的测试插件。首先，文档似乎没有一个页面告诉您如何正确执行此操作。

我发现v4的this page已通过Google搜索过时，尽管据称它位于“高级主题”下，但没有任何链接指向该页面！但是，它引发了我可以使用的异常。它告诉我我需要更改“编辑”。到“ editor.ui.register”。这使异常消失，但是我的工具栏和菜单项没有出现在任何地方！

我尝试切换到页面上的v5并进行搜索，发现this example。再次，它引导我到一个页面，在相应的区域中没有链接。

我尝试了示例代码“ as is”，并获得了关于不使用“ ui.registry”的过时用法的相同例外！但是我解决了这个问题，然后得到了这个异常：

Uncaught Error: Errors: 
Failed path: (toolbarbutton)
Could not find valid *strict* value for "onAction" in {
  "type": "button",
  "text": "My button",
  "icon": false
},Failed path: (toolbarbutton > icon)
Expected type: string but got: boolean

Input object: {
  "type": "button",
  "text": "My button",
  "icon": false
}
    at theme.min.js:9
    at Object.getOrDie (theme.min.js:9)
    at theme.min.js:9
    at theme.min.js:9
    at Object.fold (theme.min.js:9)
    at theme.min.js:9
    at Object.fold (theme.min.js:9)
    at dE (theme.min.js:9)
    at theme.min.js:9
    at _ (theme.min.js:9)

我尝试了更多但没有成功。例如，如果我删除按钮，则工具栏根本不会出现，但是没有错误。如果删除工具栏引用，则会重新出现工具栏，但是菜单选项仍然没有出现。

我要做的只是创建一个简单的示例，在该示例中，我创建一个菜单选项，该选项将某些内容记录到控制台，并在工具栏上添加一个按钮，单击该按钮时也执行相同的操作。

我该怎么做？我发现的所有其他问题似乎都与TinyMCE的旧版本有关。

Answer 1

该页面实际上已从导航中删除，因为尚未针对TinyMCE 5.0进行过更新，但实际上今天已进行了更新，以包含适用于5.0的示例。我猜您可能已经找到了该页面的缓存副本，所以我也将在此处添加详细信息。

在5.0中，菜单和按钮API的变化相当大，因此可以在此处找到用于注册菜单和按钮的新文档：

因此要将它们用于自定义插件，您需要执行以下操作：

[ { movieId: '1',
    title: "American President, The (1995)",
    genre:'Comedy|Drama|Romance' },
  { movieId: '2',
    title: "The creator(xxxx) Creation",
    genre: ' Comedy|Drama|Romance' },
  { movieId: '3',
    title: "Destruction The destroyer(xxx)",
    genre: ' Comedy|Drama|Romance' } ]

要将菜单添加到菜单栏，则还必须包含tinymce.PluginManager.add('example', function(editor, url) { var openDialog = function () { return editor.windowManager.open({ title: 'Example plugin', body: { type: 'panel', items: [ { type: 'input', name: 'title', label: 'Title' } ] }, buttons: [ { type: 'cancel', text: 'Close' }, { type: 'submit', text: 'Save', primary: true } ], onSubmit: function (api) { var data = api.getData(); // Insert content when the window form is submitted editor.insertContent('Title: ' + data.title); api.close(); } }); }; // Add a button that opens a window editor.ui.registry.addButton('example', { text: 'My button', onAction: function () { // Open window openDialog(); } }); // Adds a menu item, which can then be included in any menu via the menu/menubar configuration editor.ui.registry.addMenuItem('example', { text: 'Example plugin', onAction: function() { // Open window openDialog(); } }); return { getMetadata: function () { return { name: "Example plugin", url: "http://exampleplugindocsurl.com" }; } }; });和menu配置，因为context属性已被删除。我们正在寻找其他方法将其恢复（请参阅https://github.com/tinymce/tinymce/issues/4835）。

以下是所有工作的小提琴：http://fiddle.tinymce.com/VEgaab

在TinyMCE 5中创建插件

1 个答案: