How to prevent some x-blade attributes being rendered in html?-CodePudding

everyone, currently I'm working on some Laravel project, where I want to have x-blade component which renders html depending on what attributes are passed to the component, but I don't want attributes themselves to be rendered in to the html.

component blade file:

@props([
    'variant'=>'red',
    'styles'=>[
        'red'=>'bg-red text-white h-11 px-4 rounded-xl flex justify-center items-center font-bold',
        'white'=>'bg-white border border-red h-11 px-4 rounded-xl flex justify-center items-center font-bold'
    ]
])

<a href="{{$attributes['href']}}" {{$attributes->merge(['class'=>$styles[$variant]])}}>
    {{$slot}}
    @if($attributes['external'])
        <div >
            I'm external
        </div>
    @endif
</a>

my component:

<x-test href="#"  variant="white" external>
    Button text
</x-test>

rendered html:

<a href="#"  external="external">
    Button text
    <div >
        I'm external
    </div>
</a>

as you can see <a> tag is being rendered with external="external" attribute and I want to prevent that.

Big thanks in advance for your time and energy!!! :)

CodePudding user response：

just declare $external in props to prevent that and use it like a normal variable

  @props([
      ...
      'external'=false
])

<a {{ $attributes }} {{$attributes->merge(['class'=>$styles[$variant]])}}>
    {{$slot}}
    @if($external)
        <div >
            I'm external
        </div>
    @endif
</a>

CodePudding user response：

Or try this:

 $attributes->merge(['class'=>$styles[$variant]])->except('external')