Laravel | 如何在JavaScript中访问会话数组？

Question

Laravel | 如何在JavaScript中访问会话数组？

javascriptarrayslaravellaravel-5.4laravel-blade

3

我正在从控制器向视图传递一个数组。

下面是控制器函数：

$notification = array(
            'message' => 'Welcome Admin!', 
            'alert_type' => 'success',
        );
return redirect('/home')->with('notification', $notification);

在我的看法中：

<script>
  @if(Session::has('notification'))//this line works as expected

    var type = "{{ Session::get('alert_type', 'info') }}";
   //but the type var gets assigned with default value(info)
    switch(type){
        case 'info':
            toastr.info("{{ Session::get('message') }}");
            break;

        case 'warning':
            toastr.warning("{{ Session::get('message') }}");
            break;

        case 'success':
            toastr.success("{{ Session::get('message') }}");
            break;

        case 'error':
            toastr.error("{{ Session::get('message') }}");
            break;
    }
  @endif
</script>

正如您所看到的，我尝试访问var type = "{{ Session::get('alert_type', 'info') }}";中的数组值时出现了明显的问题。

编辑-1： 我尝试做了一些修改。

var type = "{{ Session::get('notification')->alert_type, 'info' }}";
switch(type){
    case 'info':
        toastr.info("{{ Session::get('notification')->message }}");
        break;

    case 'warning':
        toastr.warning("{{ Session::get('notification')->message }}");
        break;

    case 'success':
        toastr.success("{{ Session::get('notification')->message }}");
        break;

    case 'error':
        toastr.error("{{ Session::get('notification')->alert_type }}");
        break;
}

但现在我遇到了一个错误，错误提示为：

试图获取非对象属性（视图：C：\xampp\htdocs\financetest1\resources\views\layouts\master.blade.php）（视图：C：\xampp\htdocs\financetest1\resources\views\layouts\master.blade.php）

有没有人能帮我解决这个问题？

- Sapnesh Naik

3个回答

3

取代 {{ Session::get('message') }}

尝试使用 {{ Session::get('notification')->message }} 和 { Session::get('notification')->alert_type }}。

您的会话消息返回数组，需要使用数组键来获取消息，而不是直接使用键。

- milo526

好的，但我遇到了一个错误 尝试获取非对象属性 这是我做的 var type = "{{ Session::get('notification')->alert_type, 'info' }}"; - Sapnesh Naik

0

好的，在参考了 @milo526 的答案后，我进行了更多的研究并找到了解决方案。@milo526 的解决方案试图将数组作为对象访问，因此 Laravel 出现了问题。我尝试了另一种方法，现在它可以正常工作了！

var type = "{{ Session::get('notification')['alert_type'], 'info' }}";
switch(type){
    case 'info':
        toastr.info("{{ Session::get('notification')['message'] }}");
        break;

    case 'warning':
        toastr.warning("{{ Session::get('notification')['message'] }}");
        break;

    case 'success':
        toastr.success("{{ Session::get('notification')['message'] }}");
        break;

    case 'error':
        toastr.error("{{ Session::get('notification')['message'] }}");
        break;
}

- Sapnesh Naik

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Marwelln · Accepted Answer

你应该将PHP和Javascript代码分开。在你的HTML中使用data属性，并在你的Javascript代码中获取这些值。

例如，以下是HTML代码（我使用json_encode来支持换行符）：

<body {{ Session::has('notification') ? 'data-notification' : '' }} data-notification-type='{{ Session::get('alert_type', 'info') }}' data-notification-message='{{ json_encode(Session::get('message')) }}'>
    // ...
</body>

然后在你的JS文件中：

(function(){
    // Don't go any further down the script if [data-notification] is not set.
    if ( ! document.body.dataset.notification)
        return false;

    var type = document.body.dataset.notificationType;
    switch(type){
        case 'info':
            toastr.info(JSON.parse(document.body.dataset.notificationMessage));
            break;

        case 'warning':
            toastr.warning(JSON.parse(document.body.dataset.notificationMessage));
            break;

        case 'success':
            toastr.success(JSON.parse(document.body.dataset.notificationMessage));
            break;

        case 'error':
            toastr.error(JSON.parse(document.body.dataset.notificationMessage));
            break;
    }
})();

您可以通过以下方式缩短您的JS代码：

(function(){
    // Don't go any further down the script if [data-notification] is not set.
    if ( ! document.body.dataset.notification)
        return false;

    var type = document.body.dataset.notificationType;
    var types = ['info', 'warning', 'success', 'error'];

    // Check if `type` is in our `types` array, otherwise default to info.
    toastr[types.indexOf(type) !== -1 ? type : 'info'](JSON.parse(document.body.dataset.notificationMessage));

    // toastr['info']('message') is the same as toastr.info('message')
})();

更多信息请参考：HTMLElement.dataset、条件（三元）运算符