Push css/js files from one component to another

Question

I created 2 components: layouts/app.blade.php and navigation.blade.php

The layouts/app.blade.php looks like this:

<body>
    @stack('styles')
    <x-navigation/>
</body>

The navigation.app.blade looks like this:

<nav>
    @push('styles')
        <link rel="stylesheet" href="navigation.css"/>
    @endpush
</nav>

The problem is that my @push() method is not working. From what I understand the component that is pushing should also extend the layout, but this is not possible because the navigation should not inherit all the layout's content. There's any possibility for me to send the css/js files from a component to another component without extending it?

Thank you!

Marius Susanu · Accepted Answer · 2022-07-18 14:38:23Z

3

Create a new file layouts/default.blade.php

<body>
    @stack('styles')
    {{ $slot }}
</body>

Change layouts/app.blade.php to

<x-layouts.default>
    <x-navigation/>
    {{ $slot }}
</x-layouts.default>

answered Jul 18, 2022 at 14:38

Marius Susanu

587 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Push css/js files from one component to another

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related