[SOLVED] can't insert block in editorjs

can't insert block in editorjs

I am using Editor.js. I've tried adding a new block to the editor but it doesn't work

<html>
    <script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@2.30.6/dist/editorjs.umd.js" type="text/javascript"></script>
</head>
<body>
    <div id="editorjs" class="editor-holder"></div>

    <script>
        var editor = new EditorJS({
      holder: 'editorjs',
      autofocus: true,
      data: {
        "time": 1550476186479,
        "blocks": [{
            type: 'paragraph',
            data: {
             text: 'Hello world'
            }}
        ]}
    })

    const newBlock = {
      type: 'paragraph',
      data: {
          text: 'Hello world'
      }
    };

    editor.blocks.insert(newBlock.type, newBlock.data);

    </script>

</body>

I'm facing the following error:

Uncaught TypeError: Cannot read properties of undefined (reading 'insert')

I've also tried following:

editor.blocks.insert(newBlock);

editor.configuration.data.blocks.push(newBlock);

editor.api.blocks.insert(newBlock);

but I get errors

Solution

That because your Editor is not ready at that time when you updating the editor and the error you are showing is of blocks doesnt exist in editor varaible so try this:

editor.isReady
  .then(() => {
    editor.blocks.insert('paragraph', {
      text: 'Hello world',
    });
  })
  .catch((error) => {
    console.error('Editor.js initialization error', error);
  });