Issue #1867💬 AnsweredOpened March 6, 2019by arthuralmeidap0 reactions

Custom compoent and JS

快速解答by artf

The problem is happening when I attach the Js through the script key while I'm adding the block. The isComponent method is not being called for my new custom component. Hi Arthur, can you provide some code example of your case because I can't really get what is the issue. By looking at your PR, I don't understand why...

Read full answer below ↓

Question

Hi @artf ,

I'm trying to create a custom component and attach a JS to it. To give you a better example, think this component as a Slideshow component. For this component, I have some custom traits to allow the user to change some pre-defined configurations. The problem is happening when I attach the Js through the script key while I'm adding the block. The isComponent method is not being called for my new custom component.

Debugging the code, I discovered when the components are being parsed, there is a validation to check if the content is a string or an array. When we have an attached Js to the component, the content will be an object.

Checkout PR #1866 and let me know your thoughts

Answers (2)

artfMarch 10, 2019

The problem is happening when I attach the Js through the script key while I'm adding the block. The isComponent method is not being called for my new custom component.

Hi Arthur, can you provide some code example of your case because I can't really get what is the issue. By looking at your PR, I don't understand why are you trying to parse the content property, which is used by the editor for static content (eg. as a content to be edit by RTE) and so it shouldn't be parsed

editor.addComponents({
	type: 'text',
	content: `<i>Some</i> <b>static content</b> for RTE`,
});
lock[bot]March 18, 2020

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...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →
Premium option

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.

All tutorials →

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.