Extending ResponsiveGrid with Custom Properties using React and AEM SPA Architecture | AEM 6.5.5

Avatar

Avatar

seanblonien

Avatar

seanblonien

seanblonien

29-12-2020

I have read through the related posts (original post that I'm making this in response to) showing me how to extend the ResponsiveGrid in React.

However, I have yet to see any solution that can actually add custom properties to an extended ResponsiveGrid Sling model.

 

This example repo by godanny86 with an extended ResponsiveGrid shows how to make it custom, but it doesn't show how to add properties to the Sling model.

There have been other posts this mentioning this solution, such as this post, this other post, and finally this post, but none of them ever show how or if it's possible to add custom properties to the extended model.

Some posts like this hinted at the possibility, but I have failed to get it working when I tried the suggested solution on my own. When I have tried implementing the delegation pattern for a custom ResponsiveGrid Sling model, I can't properly implement the interface ResponsiveGridExporter because the deprecated method getAllowedComponents doesn't have reference to the return type any longer. Code_t6bKHcemnB.png
When I tried extending the ResponsiveGrid class itself, it still didn't properly persist the new fields/model values.

 

I am sure this behavior exists, but I have just been unable to implement the pattern of adding custom properties to an extended model so far.
Does anybody have a working example that adds custom properties to an extended ReponsiveGrid custom component and persists them to React? Or, does anyone know who I contact about the Java com.adobe.cq package problems?

Accepted Solutions (0)

Answers (1)

Answers (1)

Avatar

Avatar

kunal23

MVP

Avatar

kunal23

MVP

kunal23
MVP

29-12-2020

I haven't tried it myself but I guess with delegation pattern also you can just override the getExportedAllowedComponents as getAllowedComponents is deprecated. 

Javadoc-

https://helpx.adobe.com/experience-manager/6-5/sites/developing/using/reference-materials/javadoc/co... 

 

Here is an example of extending the model using delegation pattern - https://levelup.gitconnected.com/aem-extend-core-component-models-using-resource-type-association-an...