How to update the model for a custom component when a trait is changed.
I have finally figured this out on my own and want to share the result for anyone else that is struggling with this the way I did. This code snipped creates a custom, responsive video component that supports YouTube, Vimeo, MyVRSpot, and a custom iframe src. I was able to get the model to update in the canvas when a c...
Read full answer below ↓Question
Hi! I have read and re-read the GrapesJS Docs and API Reference on how to create a custom component and I just can't seem to figure it out. I initially started trying to extend the existing video component but then decided to make my own custom video component. I'm using the existing video component as a guide. My component can be dragged onto the canvas and the component settings (traits) can be toggled but nothing updates in the canvas. My component tagName is a div because I need a wrapper to make the inner iframe responsive via CSS. That in itself could be an issue in how I'm adding the i...
Answers (1)
I have finally figured this out on my own and want to share the result for anyone else that is struggling with this the way I did. This code snipped creates a custom, responsive video component that supports YouTube, Vimeo, MyVRSpot, and a custom iframe src. I was able to get the model to update in...
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2741
How to wrap component with text nodes based on trait?
Hello @artf , I'm not sure if this goes here but I can't figure out from the documentation how to update the component model based on a tra...
Issue #2777
[QUESTION] How to update styles in Style Manager
Hello. I created custom component where I set backgraound-image via custom asset manager Custom block code: Command which I run to set new...
Issue #358
Calling updateScript from the script section of a pluging
Hi guys, I've been stuck for a few hours trying to figure out how to call updateScript from the script section of a custom plugin. So far I...
Issue #3939
Disabled drag and drop in preview
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? v95Reproducible demo link https://codesandbo...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.