jcmcneal / react-step-wizard

A modern flexible step wizard component built for React.
MIT License
580 stars 126 forks source link

how to pass additional props to steps #102

Open olasunkanmi1 opened 2 years ago

olasunkanmi1 commented 2 years ago

Is there a way to pass additional props to each steps aside the initial props i.e. previousStep, nextStep e.t.c

MauroG91 commented 1 year ago

I hope this helps you. This is how I implemented where I am working.

const components: any = [ { name: "component-1", component: Component1 }, { name: "component-2", component: Component2 }, { name: "component-3", component: Component3 }, ];

const steps = components.map((component: object, index: number) => { return { ...component, props: { something: ":D" }, }; });

const handleRender = () => { const arrOfComponents = steps.map((step) => createElement(step.component, step?.props) ); const arrOfChildren = Children.toArray(arrOfComponents); return Children.map(arrOfChildren, (child, index) => cloneElement(child as any) ); };

`

{handleRender()}

`