Conditional Component Type rendering?

I am trying to work on a component where depending on a variable I need to wrap it with either an

<a>

<a>

tag or a

<div>

<div>

.

The only conditional flow related documentation uses the

<Show>

<Show>

component, but I'm trying to do something more akin to

// pseudo JSX
<props.url ? a : div>
   <div>the same other elements</div>
   <Etc />
</a or div>

// pseudo JSX
<props.url ? a : div>
   <div>the same other elements</div>
   <Etc />
</a or div>

I'm pretty sure something like the following would work, but how do I do this with basic HTML elements?

const ConditionalComponent = props.url ? componentA : componentB
...
<ConditionalComponent>
   <div>otherstuff</div>
</ConditionalComponent>

const ConditionalComponent = props.url ? componentA : componentB
...
<ConditionalComponent>
   <div>otherstuff</div>
</ConditionalComponent>

thanks!

SolidJS•3y ago•

2 replies