I have a file called all.blade.php that looks like this:
@component('admin.layouts.content' , ['title' => 'example file'])
@slot('breadcrumb')
<li class="breadcrumb-item active">Example File</li>
@endslot
...
@endcomponent
@push('scripts')
<script>
Swal.fire({
title: 'Do you want to save the changes?',
showDenyButton: true,
showCancelButton: true,
confirmButtonText: 'Save',
denyButtonText: `Don't save`,
}).then((result) => {
/* Read more about isConfirmed, isDenied below */
if (result.isConfirmed) {
Swal.fire('Saved!', '', 'success')
} else if (result.isDenied) {
Swal.fire('Changes are not saved', '', 'info')
}
})
</script>
@endpush
This is content.blade.php:
@extends('admin.master')
@section('content')
{{ $slot }}
@endsection
This is master.blade.php:
<!DOCTYPE html>
<html>
<head>
...
@stack('scripts')
</head>
<body>
@yield('content')
</body>
</html>
Now the problem is @push('scripts') ... @endpush doesn't work and doesn't show the sweet alert message.
So what’s the problem here? How can I solve this problem and call @component and @push together on blade?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Try
Ctrl UCheck if the component is rendered to its position. Also note that if you are using the Swallibrary JS library, the actual Swallibrary code is loaded before the fire() function is called.Finally please check the browser console options to determine if it is some JS error and not a Blade error.
Replace the order of
@pushand@component@push('scripts') @endpush @component('admin.layouts.content' , ['title' => 'example file']) @slot('breadcrumb')Another option is to convert the main to a component
... {{ $scripts ?? '' }} {{ $slot }}and convert content into components
Then you can write all.blade.php as