SolidJS•16mo ago

Is it possible to use Outlet inside conditional render like Show?

Hi, is doing the above okay or not recommended ? Trying it seems to have strange results with route data on routes and eventually nothing renders,. Moving the outlet to outside Show it works fine. I can try make some reproducible example somewhere but meantime wondering if there's a clear guideline like Outlet should not be rendered conditionally Thanks

3 Replies

MaxOP•16mo ago

Don't think it was really related to Outlet, just I think on hot reload change it worked. Moving Outlet to outside Show gives still seems to not render but also given an error

dev.js:72 Uncaught (in promise) DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

dev.js:72 Uncaught (in promise) DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

Idk exactly the explanation but what seems to work is replace

    <>
      <Show ... >
        {...}
      </Show>
      <Outlet />
    </>

    <>
      <Show ... >
        {...}
      </Show>
      <Outlet />
    </>

with

    <div>
      <Show ... >
        {...}
      </Show>
      <Outlet />
    </div>

    <div>
      <Show ... >
        {...}
      </Show>
      <Outlet />
    </div>

dont know if fragment and outlet and show together has some complication in working but seems fixed if not using fragment

Grahf•16mo ago

If you're still working on it.....you might be able to wrap the <Outlet /> in a <div> that is has CSS hidden applied. Or you could give it a width of 0 under certain conditions or an opacity of 0 under certain conditions etc

MaxOP•16mo ago

thanks, anyway was just prototyping something I'll just take a different approach completely cause didnt really make sense to use show for this. But was curious about outlets conditionally rendered in show, does seem to have so strange behaviour, maybe, was not really able to isolate the issue

Gaming

Programming

Is it possible to use Outlet inside conditional render like Show?