Laravel Inertia JS Flash 消息仅显示一次

Question

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

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

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

Flash组件：

<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>

这工作正常，闪光灯出现，花了几秒钟然后消失。但无论我点击同一个按钮多少次来获取此闪现消息，它都不会发生，我的大脑即将爆炸！

Answer 1

从此处的文档中，您必须寻找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 的共享数据属性，它是一个带有消息键的关联数组（对象）。

请注意，如果您使用with(['error => 'message here'])，您将只能在前端获取数据。如果您想要成功，您还必须自行添加它。

您将获得的数据示例