【问题标题】:Laravel Inertia JS Flash Messages shows only onceLaravel Inertia JS Flash Messages 只显示一次
【发布时间】:2022-08-03 03:56:46
【问题描述】:

因为 InertiaJS 不会刷新相同的路由组件,所以无论您从后端传递多少次消息,诸如 flash 消息之类的东西都只会显示一次。我尝试了一切,但没有任何效果,我所需要的只是在我执行相同操作失败后能够再次触发相同的闪存消息。

控制器: 这应该作为我正在通过一些 if 语句进行的验证的一部分触发,所以基本上我是说如果请求的数量超过库存数量,则返回此消息。

                    return back()->with([
                        \'error\' => \'This item has only \' . $item->qty . \' items in stock\'
                    ]);

闪存组件:

<script setup>
import { ref, onMounted } from \"vue\";
defineProps({
    message: Object,
});

const showNotif = ref(false);

let msgs = ref([]);

onMounted(() => {
    showNotif.value = true;
    setTimeout(() => {
        showNotif.value = false;
    }, 6000);
});
</script>

<template>
    <div>
        <Transition
            mode=\"out-in\"
            name=\"flash\"
            tag=\"div\"
            enter-active-class=\"animate__animated animate__fadeInUp\"
            leave-active-class=\"animate__animated animate__fadeOutDown\"
            appear
        >
            <p
                v-if=\"message.error && showNotif\"
                class=\"cursor-pointer fixed bottom-3 right-3 bg-red-600 px-5 py-1 font-semibold text-white rounded-xl\"
            >
                {{ message.error }}
            </p>
        </Transition>
        <Transition
            mode=\"out-in\"
            name=\"flash\"
            tag=\"div\"
            enter-active-class=\"animate__animated animate__fadeInUp\"
            leave-active-class=\"animate__animated animate__fadeOutDown\"
            appear
        >
            <p
                v-if=\"message.success && showNotif\"
                class=\"cursor-pointer fixed bottom-3 right-3 bg-green-600 px-5 py-1 font-semibold text-white rounded-xl\"
            >
                {{ message.success }}
            </p>
        </Transition>
    </div>
</template>

这工作正常,闪光灯出现,花了几秒钟然后消失。但无论我点击同一个按钮多少次来获取这条消息,它永远不会发生,我的大脑快要爆炸了!

    标签: laravel vue.js single-page-application inertiajs


    【解决方案1】:

    从文档here 中,您必须查找app/Http/Middleware/HandleInertiaRequests.php 并确保您有类似的东西。

    class HandleInertiaRequests extends Middleware
    {
        public function share(Request $request)
        {
            return array_merge(parent::share($request), [
                'flash' => [
                    'error' => fn () => $request->session()->get('error')
                ],
            ]);
        }
    }
    

    基本上,您正在创建一个名为 flash 的 shared_data 道具,它是一个带有消息键的关联数组(对象)。

    请注意,如果您执行with(['error =&gt; 'message here']),您只会在前端获取数据。如果您想要success,您还必须自己添加它。

    您将获得的数据样本

    【讨论】:

      猜你喜欢
      • 2021-08-29
      • 2021-09-19
      • 2011-07-05
      • 2021-04-09
      • 2022-12-09
      • 1970-01-01
      • 2020-10-25
      • 2011-01-23
      • 2021-12-23
      相关资源
      最近更新 更多