Init components in grapesjs.init
You need to parse the string. JSON.parse(projectData.components)
Read full answer below βQuestion
Is it possible to initialise the components at grapesjs.init. We are not using StorageManager.load. We already have the project data at init. Using html works fine, but using components renders the components object as text in the editor. this.editor = grapesjs.init({ components: projectData.components || projectData.html, style: projectData.styles || projectData.css, container: '#gjs', plugins: ['gjs-preset-webpage'], pluginsOpts: { 'gjs-preset-webpage': { } }, storageManager: { id: '', // Prefix identifier that will be used on parameters type: 'catchService', // Type of the storage urlStore...
Answers (3)
You need to parse the string.
JSON.parse(projectData.components)
Working now. Thank you for the fast and accurate reply :-)
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #438
Imported HTML, I can move components but not edit them
All I did was import HTML, except I can't modify the text in the HTML I can't type anything or remove any text
Issue #2073
Trouble using urlLoad
I've got an issue calling to my endpoint to load a template, it's doing a pre flight OPTIONS request but I cant find how to continue after...
Issue #597
StorageManager: Loading from remote storage
Hi, I'm trying to read the HTML and CSS from my database. When I try to load it into the editor, nothing displays. I can store the data jus...
Issue #1281
What is the proper way to initialize the editor with an already existing HTML and CSS content?
Hi @artf , it seems that in order to initialise an instance of the editor with an already existing CSS you can either give the editor "gjss...
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 βRelated tutorials
In-depth guides on the same topic.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.