Laravel dynamic HTML tag name, based on if href is passed

Question

I have a laravel component

<x-link :href="{{ $href }}">
    some text
</x-link>

If I don't pass $href prop I want to print span tag instead, without duplicating code, but on tag directly.

Something like this that exists in Vue.js would be nice:

<component :is="href ? 'a' : 'span'">
    some text
</component>

Answer 1

If you want to conditionally render Laravel components, use syntax:

<x-dynamic-component :component="$componentName">
    some text
</x-dynamic-component>

If you want to conditionally render HTML tags, just render tag name as a variable. (Maybe your editor will not parse and highlight it correctly, but functionally it should be ok.)

<{{ $tagName }}>
    some text
</{{ $tagName }}>

It's not possible to conditionally render Laravel component or HTML tag. So if you want to switch between <x-link> and <span>, just create custom component <x-span> and use it instead of <span>.