Question

我制作了一个非常简单的自定义小部件，但我想通过自定义按钮而不是工具栏按钮将其添加到编辑器中，因此我使用editor.execCommand("mywidget")。小部件已正确添加，但如何通过此execCommand调用将数据传递到小部件？在docs中它表示execCommand的第二个参数用于将数据传递给命令处理程序，但是我似乎无法在我之后找到如何在窗口小部件代码中访问它致电execCommand("mywidget", {paramshere})。

谢谢！

Answer 1

定义命令时，或者如果需要修改现有命令，只需要向exec函数添加第二个参数，如下所示：

   function myCommandName(data){
     this.data = data
   } 
   myCommandName.prototype = {
     exec: function(editor, data) {
       if(data){
         doSomethingWithData(data);
       }
     }
   }
   editor.addCommand( 'myCommandName', new myCommandName(optionalDefaultData) )

要在执行时将数据传递给命令，请在命令名后提供数据作为第二个属性。

editor.execCommand('myCommandName', { data: 'my data' });

Answer 2

已为CKEditor 4.5.0 Beta更新docs，并且通过该命令指定窗口小部件数据的功能是此版本的新功能。

因此，从CKEditor 4.5.0 Beta开始，这将是可能的：

editor.execCommand( 'simplebox', {
    startupData: {
        align: 'left'
    }
} );

但在此版本之前，您需要直接使用Widget API。了解command works now in 4.5.0 Beta的方式。这里有相当多的代码，但大部分内容都是关于打开对话框并在将widget元素插入编辑器之前处理它（它必须保存在某个地方）。

如果您只想插入小部件，只需按照documentation：

进行操作即可

var element = editor.document.createElement( 'div' );
editor.insertElement( element );
var widget = editor.widgets.initOn( element, 'simplebox', { align: 'left' } );

如您所见widgetsRepository.initOn()接受数据对象。

在CKEditor

2 个答案: