I have a requirement of creating a carousel container component with parsys dropped inside it, the FE part is done using react.
I'm getting the number of parsys to be dropped inside the container through the model.json that will be passed as a prop to my React component.
Based on the value I'm iterating the Responsive grid component from @adobe/aem-react-editable-components library version 2.0.1.
Code:
function CardType (cardCount,index) {
for(i=0;i<cardCount;i++){
<ResponiveGrid
pagePath="/content/poc/us/en/test"
itemPath="root/responsivegrid/carousel/card${index}"
/>
}
}
The above function adds parsys to the carousel container, and through page policy, I'm configuring the allowed components.
The issue is, once I drop any component inside the parsys there is an infinite loop of API calls to model.json http://localhost:4502/content/poc/us/en/test/jcr:content/root/responsivegrid/carousel/card0.model.js....
Inside crx/de, the cards node is created with the correct authoring value but on a refresh of AEM authoring env the authoring data is lost, but the cards node is still inside crx/de with all the values.
I have looked at all examples related to components inside components but couldn't find the right solution.
Can anyone please help.
Views
Replies
Total Likes
I am not sure if you found a solution for this. Panel based container components are not feasible directly with SPA 2.0. I provided a fix by exposing getChildComponents method from the 2.x editable components and waiting for PR to be merged.
In the interim you can have a workaround, but does require some mimimal code duplication.
Looking for some support from Adobe's team.
https://github.com/adobe/aem-react-editable-components/pull/197
@arunpatidar @kautuk_sahni - Please see if you can get assistance on these PRs. Once merged I can create a blog post on creating panel containers using SPA 2.0
Views
Replies
Total Likes