Open sarathBM opened 8 months ago
Try importing getChildComponents
import { EditableComponent, getChildComponents, MapTo } from "@adobe/aem-react-editable-components";
const MyTabs = (props) =>
{
const tabItemsInOrder = getChildComponents(props);
const tabItemsJsx = tabItemsInOrder.map((tabItemJsx) =>
{tabItemJsx}
);
return
{tabItemsJsx}
;
}
Hi All,
I am using AEM artifact 47 with extending react version to 18 and aem-react-editable-componnets version 2.1.1
I am able to use container component with aem-react-editable-componnets version 2.1.1, but unable to use Tabs component, I have done mapping Tabs component to Core AEM tabs component I am getting below issue
Below is the one using package.json "dependencies": { "@adobe/aem-react-editable-components": "^2.1.1", "@adobe/aem-spa-component-mapping": "1.1.1", "@adobe/aem-spa-page-model-manager": "1.5.0 ", "custom-event-polyfill": "^1.0.7", "history": "^5.3.0", "neom-ui": "github:NEOM-KSA/Neom-UI#develop", "react": "^18.2.0", "react-app-polyfill": "^3.0.0", "react-dom": "^18.2.0", "react-router-dom": "^6.21.3", "sanitize-html": "^2.11.0", "util": "^0.12.5" },
Here is the code UI.frontend component code import { MapTo, Container,
ResponsiveGrid } from '@adobe/aem-react-editable-components';
const MyTabsEditConfig = { emptyLabel: 'Tabs', isEmpty: function(props){ return !props.cqItemsOrder || !props.cqItemsOrder.length ===0 } }
const MyTabs = (props) =>
{ const tabItemsInOrder = Container.getChildComponents(props); const tabItemsJsx = tabItemsInOrder.map((tabItemJsx) =>
export default MapTo('neom-authority-platform/components/tabs')(MyTabs, MyTabsEditConfig);
After integrating the code I am gettin the error clientlib-react.js:2 TypeError: pe.Container.getChildComponents is not a function at emptyLabel (clientlib-react.js:2:149121)
Can any one help with This issue