简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
無法在 Blade 內成功執行 JavaScript 程式碼
P粉476046165
P粉476046165 2024-02-25 18:05:56
0
2
377

我有一個名為 all.blade.php 的文件，如下所示：

@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

這是 content.blade.php：

@extends('admin.master')

@section('content')
   {{ $slot }}
@endsection

這是 master.blade.php：

<!DOCTYPE html>
  <html>
     <head>
        ...
        @stack('scripts')
     </head>
     <body>
        @yield('content')
     </body>
   </html>

現在的問題是 @push('scripts') ... @endpush 不起作用並且沒有顯示甜蜜的警報訊息。

那麼這裡出了什麼問題呢？我怎麼能解決這個問題並在刀片上一起調用@component和@push？

P粉476046165
P粉476046165

全部回覆(2)
P粉681400307
P粉6814003072024-02-26 14:09:17 2樓

嘗試 Ctrl U 檢查該元件是否呈現到其位置。另請注意，如果您使用的是 Swallibrary JS 庫，那麼實際的 Swallibrary 程式碼會在呼叫 fire() 函數之前載入。

最後請檢查瀏覽器控制台選項以確定是否是某些 JS 錯誤，而不是刀片錯誤。

點贊 +0
新增回覆
P粉494151941
P粉4941519412024-02-26 12:58:45 1樓

調換 @push 和 @component 的順序

@push('scripts')
    
@endpush

@component('admin.layouts.content' , ['title' => 'example file'])
   @slot('breadcrumb')
  • Example File
    • @endslot … @endcomponent

    另一種選擇是將主轉換為元件

    

  
     
        …
        {{ $scripts ?? '' }}
     
     
        {{ $slot }}

    並將內容轉換為元件

    

    
       {{ $scripts ?? '' }}
    
    {{ $slot }}

    然後你可以將all.blade.php寫成

    
    
        
    
    
    All
    點贊 +0
    新增回覆
    熱門專題
    更多>
    熱門文章
    熱門教學
    更多>
    相關教學
    熱門推薦
    最新課程
    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板
    關於我們 免責聲明 Sitemap
    PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！