Issue #1519Opened October 16, 2018by Controlhaus1 reactions

[QUESTIONS]: Init components in grapesjs.init

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.

Code SnippetTEXT
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: `${this.backendConfig.url}api/content`,
        contentTypeJson: true,
        autosave: true,           // Store data automatically
        stepsBeforeSave: 1,       // If autosave enabled, indicates how many changes are necessary before store method is triggered
        storeComponents: true,  // Enable/Disable storing of components in JSON format
        storeStyles: true,      // Enable/Disable storing of rules in JSON format
        storeHtml: true,        // Enable/Disable storing of components as HTML string
        storeCss: true,
      },
    });
    this.setupStorage(this.project, this.contentService);
`

![screen shot 2018-10-16 at 08 58 22 2](https://user-images.githubusercontent.com/6704041/46998023-aceae000-d121-11e8-9f68-5b286bd91291.png)

Answers (3)

cjpollardOctober 16, 20181 reactions

You need to parse the string. JSON.parse(projectData.components)

ControlhausOctober 16, 20180 reactions

Working now. Thank you for the fast and accurate reply :-)

lock[bot]October 16, 20190 reactions

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.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.