© 2026 Hedgehog Software, LLC
Dynamic
import { Dynamic, render } from "solid-js/web"; import { createEffect, createSignal } from "solid-js"; export const StepperLayout = (props) => { console.log('QWEQWEQWEQE'); return <>STEP LAYOUT {props?.children}</>; }; export const AppLayout = (props) => { return <>APP LAYOUT {props?.children}</>; }; const LayoutHome = (props: { children; currentStep?: string }) => { const [layout, setLayout] = createSignal(AppLayout); createEffect(() => { if (props.currentStep?.startsWith('STEP')) { setLayout(StepperLayout); } }); createEffect(() => { console.log(layout(), AppLayout); }); return <Dynamic component={layout()}>{props.children}</Dynamic>; }; function Counter() { const [count, setCount] = createSignal(1); const increment = () => setCount(count() + 1); return ( <button type="button" onClick={increment}> {count()} </button> ); } render(() => <><LayoutHome currentStep="STEP">toto</LayoutHome></>, document.getElementById("app")!);