如何在 Javascript 代码中显示从数据库中检索到的 Laravel 结果

How to show Laravel retrieved results from the DB in a Javascript code

我正在使用 Laravel 5.8,我想制作一个弹出系统,以便管理员可以添加自定义图像和自定义文本,然后在 blade,弹出窗口必须基于该信息。

这里是 popups 的 table 结构:

1   id Primary  bigint(20)  
2   datep       varchar(191)    
3   title       varchar(191)    
4   linkp       varchar(191)    
5   text        varchar(191)    
6   image_path  varchar(191)    
7   created_at  timestamp   
8   updated_at  timestamp

这是弹出窗口的 Javascript 部分:

  <script>
    $(document).ready(function(){
            let popup_shown = false;
            let cookies = document.cookie.split('; ');
            for( let i=0; i<cookies.length; i++ ){
                cookie = cookies[i].split('=');
                if( cookie[0] == 'oly12_reg_ext2_popup_shown' )
                    popup_shown = true;
            }
            if( !popup_shown ){
                Swal.fire({
                    html: '<a href="#"><img style="width: 100%;" src="{{ URL::to('/') }}/popup.jpg"></a>',
                    showConfirmButton: false
                });
                document.cookie = "oly12_reg_ext2_popup_shown=1; path=/";
            }
        });
   </script>

但现在的问题是我不知道如何将 Laravel 和 Javascript 混合在一起以显示弹出消息。

例如,它应该看起来像这样:

@if(count($popups)>0)
    $(document).ready(function(){
        let popup_shown = false;
        let cookies = document.cookie.split('; ');
        for( let i=0; i<cookies.length; i++ ){
           cookie = cookies[i].split('=');
           if( cookie[0] == 'oly12_reg_ext2_popup_shown' )
              popup_shown = true;  
        }
    if( !popup_shown ){
        @foreach($popups as $popup)
        Swal.fire({ 
               html: '<a href="{{ $popup->linkp }}"><img style="width: 100%;" src="{{ URL::to($popup->image_path) }}"></a>',
        @endforeach
@endif

但这显然是错误的。

所以问题是,如何在 Javascript 代码中显示从数据库检索到的 Laravel 结果?

在你的控制器中,你可以将弹出数据传递给一个变量,然后像这样将它传递到视图中,

控制器内部;

$output = "";
$popups = PopUp::all();
if($popups->count() > 0)
{ 
foreach($popups as $popup)
{ 
$output .=' <a href=" '.$popup->linkp.' "><img src=" '. URL::to($popup->image_path).' " style="width: 100%;"></a>';
}
json_encode($output)

然后在您的 blade 视图中 javascript,

@section('scripts')
<script>
$(document).ready(function(){
 let popup_shown = false;
 let cookies = document.cookie.split('; ');
 for( let i=0; i<cookies.length; i++ ){ 
    cookie = cookies[i].split('='); 
    if( cookie[0] == 'oly12_reg_ext2_popup_shown' )
         popup_shown = true; 
} 

if( !popup_shown ){
    var popup_data = '{{!! $output !!}}'
    Swal.fire({ html:popup_data });
}

</script>
@endsection