如何将块数据加载到 EditorJS 中？

Question

我想将块数据动态加载到我的 EditorJS 实例。我想做这样的事情：

const editor = new EditorJS();
editor.load({ blocks: my_blocks })

上找到任何关于如何操作的文档

我知道我可以在初始化期间将块加载到 EditorJS，但我需要在单击按钮时加载动态数据。

Answer 1

您可以通过 insert() 方法使用 Blocks Core API，使用以下签名：

 insert(type?: string, data?: BlockToolData, config?: ToolConfig, index?: number, needToFocus?: boolean): void

因此，在您的情况下，可能是：

editor.blocks.insert('header', {text: 'My header'});

其中 header 是类型第二个参数是块 data

一种更简洁的方法是按如下方式预定义您的块：

const blockToAdd = {
  type: 'header', 
  data: {
     text: 'My header'
  }
};

editor.blocks.insert(blockToAdd);

Answer 2

不确定何时将其添加到 API，但也有 editor.render(data) 可将 JSON 数据动态加载到编辑器中。

render(data: OutputData): Promise
Method removes all Blocks and fills with new passed JSON data

How to load blocks data into EditorJS?