-
Notifications
You must be signed in to change notification settings - Fork 11.6k
Description
Laravel Version
11.30
PHP Version
8.3.11
Database Driver & Version
No response
Description
When we reference a blade view component (let's say, child.blade.php) from within another blade view component (parent.blade.php), we sometimes need to pass on the attributes of the parent to the child like so:
<x-child {{ $attributes->merge(["class" => "text-white"]) }}>Hello World</x-child>
.
The above syntax is flagged off as an error by the Blade engine. But in reality there's no error in the syntax. This fact can be verified by replacing the <x-child>
tag with a standard HTML tag like e.g., <p>
like so:
<p {{ $attributes->merge(["class" => "text-white"]) }}>Hello World</p>
.
The above syntax is not flagged as an error and the Blade engine renders it. There's a workaround for getting Blade to render the usage of x-child
tag as shown previously, though. The work around is to replace the double quotes with single quotes like so:
<x-child {{ $attributes->merge(['class' => 'text-white']) }}>Hello World</x-child>
.
Blade happily accepts the above syntax and renders the x-child
tag.
Steps To Reproduce
- Create a new Laravel App:
laravel new app
- Create two new blade components (views only):
php artisan make:component --view parent
php artisan make:component --view child
- In the welcome.blade.php view replace the
<body>
tag's content with an instance of thex-parent
tag:
<x-parent></x-parent>
- In the parent.blade.php view, create an instance of the
x-child
tag:
<div>
<x-child {{ $attributes->merge(["class" => "text-white"]) }}>Hello World</x-child>
</div>
- In the child.blade.php view, put the following code:
<div>
<p {{ $attributes }}>{{ $slot }}</p>
</div>
- Run
php artisan serve
and open the app's URL in a browser.
Result expected:
We must be able to see the text: "Hello World" in the browser.
Result observed:
ParseError
Unclosed '[' does not match ')'
Please see Github repo for a demo.