首页 > 解决方案 > 如何将参数传递给刀片或 {{ }}?

问题描述

对不起我糟糕的英语。我来自台湾。

源代码

        var channel = pusher.subscribe('question-channel');
        channel.bind('question-event', function (data) {

                var n = new Notification(data.title, {
                    icon: 'img/icon.png',
                    body: data.content,
                    image:'img/1.jpg'
                });

                n.onclick = function(e) { 
                    e.preventDefault(); // prevent the browser from focusing the Notification's tab
                    window.open('http://127.0.0.1:8000/'); 
                }

        });

我想让它成为

        var channel = pusher.subscribe('question-channel');
        channel.bind('question-event', function (data) {

            if({{\App\Models\UserAreas::where('user_id','=',Auth::id())->where('area_id','=',data.area)}})
                var n = new Notification(data.title, {
                    icon: 'img/icon.png',
                    body: data.content,
                    image:'img/1.jpg'
                });

                n.onclick = function(e) {
                    e.preventDefault(); // prevent the browser from focusing the Notification's tab
                    window.open('http://127.0.0.1:8000/');
                }

        });

但是,我无法将参数(data.area)传递给 {{ }}

我必须这样做,以确认发布的是当前登录用户的专业知识之一。

标签: phplaravelparameter-passinglaravel-bladepusher

解决方案


您有多种选择:

  1. 将数据传递到视图中并从 PHP 传递到 JS:

您在哪里调用您的视图:

use \App\Models\UserAreas;

// ...

    $userAreas = UserAreas::where('user_id','=',Auth::id())->get();
    return view('path/to/your/view', [ 'userAreas' => $userAreas ]);

在您的视野中:

        var userAreas = @json($userAreas);
        var channel = pusher.subscribe('question-channel');
        channel.bind('question-event', function (data) {

            if(userAreas.filter((area) => area.area_id === data.area).length)
                var n = new Notification(data.title, {
                    icon: 'img/icon.png',
                    body: data.content,
                    image:'img/1.jpg'
                });

                n.onclick = function(e) {
                    e.preventDefault(); // prevent the browser from focusing the Notification's tab
                    window.open('http://127.0.0.1:8000/');
                }

        });

  1. 使用 API 端点

api.php

use \App\Models\UserAreas;

// ...

Route::get('user-areas/{{userArea}}', function(int $userArea) {
    return (bool) UserAreas::where('user_id', Auth::id())->where('area_id', $userArea)->count();
});

your-view.blade.php

        var channel = pusher.subscribe('question-channel');
        channel.bind('question-event', function (data) {

            fetch('api/user-areas/' + data.area).then(function(exists) {
                if(exists) {
                    var n = new Notification(data.title, {
                        icon: 'img/icon.png',
                        body: data.content,
                        image:'img/1.jpg'
                    });

                    n.onclick = function(e) {
                        e.preventDefault(); // prevent the browser from focusing the Notification's tab
                        window.open('http://127.0.0.1:8000/');
                    }
                }
            }

        });

推荐阅读