[BUG] Custom DomComponent & Block let all elements duplicated

Question

I created a Custom Block: and a Custom DomComponent: And a Custom Command (I found where error is happening): When I set the new link for child img, any block I add to editor, is adding twice, and when I select this duplicated block, both are selected and changed:

artf · Accepted Answer

@JulyanoF you should never do this editor.DomComponents.render() if you feel like you need that function, probably you're doing something wrong... then in your custom component, you don't set isComponent method, so please review this guide: https://grapesjs.com/docs/modules/Components.html for the rest, provide a live demo with the issue

artf · Answer

I'm trying getting html of selected element (editor.getSelected().toHTML()), manipulating it and changing original content This is wrong... You should use Component's API, don't touch the view or even worse, its HTML. If you don't understand this concept (you should EDIT the MODEL of the component, not its VIEW) you will face a lot of issues

JulyanoF · Answer

@artf you are right. the problem is using render() function, that is duplicating the elements.. but, if I remove this function, the editor html didn't change.. it still showing old content and not the new. How can I avoid it? I will provide a live demo

Custom DomComponent & Block let all elements duplicated

Question

Answers (3)

Related Questions and Answers

[Question] Manipulate elements into a selected block in command

[Question] Blockmanager and Image

Place block as component programmatically

[BUG]Set href for link block not editable once initialized

Paid Plugins That Match This Issue

Related tutorials

🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS

Browse Plugin Categories