GabrielPilger's avatar

How to pass Vue props from slots to component props in Laravel blades

Hi guys, I'm new here and not so good with english, so excuse me if i write it wrong I have a component in Vue 3 that has slots, for that slot I want to pass a blade component, the blade component receives props from Vue.

<the-collapsible parents="{{ $companies_categories }}" v-slot="{image, title, route, disabledBadge}">
            @{{ image }}
            <x-card image="@{{ image }}" text="@{{ title }}" route="@{{ route }}" disabled-badge="!@{{ disabledBadge }} ? 'Indisponível' : false" image-mode="contain"/>
</the-collapsible>

I can print the image value with @{{ image }} but I can't pass it as a parameter to x-card. If I pass @{{ image }} I will get a php echo in the component. And if I directly use {{ image }} I get Undefined constat "image". Can anyone help me?

0 likes
1 reply
martinbean's avatar

@gabrielpilger A Blade component can’t receive props from Vue. All Blade templates have been rendered by the time a single line of JavaScript is ran in your browser.

Please or to participate in this conversation.