README

此包提供了使用 Laravel Livewire 的闪存消息功能。它非常直接地基于 laracasts/flash，但已扩展以添加将消息闪存到闪存容器（一个 Livewire 组件）而不重新加载页面的能力。

此包还保留了大部分（尽管不是全部）相同的“正常”闪存消息功能，这些消息将通过相同的 Livewire 组件在刷新时显示。

安装

通过 composer 安装

composer require mattlibera/livewire-flash

要求

Laravel >=7.0
Livewire ^1.2 或 ^2.0

对于新应用，考虑使用 Laravel 的 TALL 预设：[https://github.com/laravel-frontend-presets/tall]，或者此包也很好地与 Laravel Jetstream 一起工作：[https://jetstream.laravel.net.cn/]

用法

正常闪存消息（在重新加载时）

在您重定向之前，在代码的某个位置调用 flash() 辅助函数。

public function store()
{
    flash('Success!');

    return redirect()->back();
}

Livewire 闪存消息（在重新加载之前）

从您的 Livewire 组件中，使用正常的语法闪存消息，然后作为链中的最后一个方法调用 livewire() 辅助方法。您必须将 $this 作为参数传递，因为此包利用了所有 Livewire 组件上存在的 emit 辅助函数。示例

public function livewireAction()
{
    flash('Your request was successful!')->success()->livewire($this);
}

消息类型

消息类型在 livewire-flash.php 配置文件中定义，如果需要可以发布（见下文）。默认情况下，有四种支持的消息类型：info（默认，如果没有指定其他内容），success，warning 和 error。

要设置消息的类型，可以

将第二个参数传递给 flash() - 示例：flash('您的操作成功', 'success')，或者
在 flash() 后流畅地连续使用方法名 - 示例：flash('您的操作成功')->success()

这两个都将更改消息的显示（颜色和图标）到配置的样式。

覆盖消息

覆盖消息在 livewire-flash.php 配置文件中定义，如果需要可以发布（见下文）。

要设置覆盖消息，在 flash() 后连续使用方法名 overlay()。当使用覆盖时，保留 flash() 参数为空。将消息作为 overlay() 的第一个参数输入，将标题作为第二个参数输入。这可以与或不与 livewire($this) 后缀一起使用

// renders on next page load
flash()->overlay('This is my message', 'The Title');
return redirect('somewhere');

// renders immediately via Livewire
flash()->overlay('This is my message', 'The Title')->livewire($this);

请注意，默认的覆盖组件支持 HTML 代码作为主体和标题，使用 Blade 未转义 {!! !!} 标签。

自定义

要更改每种消息类型使用的样式，或者添加您自己的类型，首先发布配置文件。

php artisan vendor:publish --provider="MattLibera\LivewireFlash\LivewireFlashServiceProvider"

然后，在styles键中，您可以更改您想要的任何内容。

'styles' => [
    'info' => [
        'bg-color'     => 'bg-blue-100', // could change to bg-purple-100, or something.
        'border-color' => 'border-blue-400',
        'icon-color'   => 'text-blue-400',
        'text-color'   => 'text-blue-800',
        'icon'         => 'fas fa-info-circle', // could change to another FontAwesome icon
    ],

或者您可以添加您自己的样式。

'notice' => [
    'bg-color'     => 'bg-orange-100',
    'border-color' => 'border-orange-400',
    'icon-color'   => 'text-orange-400',
    'text-color'   => 'text-orange-800',
    'icon'         => 'fas fa-flag',
],

无论哪种情况，只需确保您通过配置键调用警报：flash('一条重要的消息')->notice()

要自定义叠加样式，请参阅配置文件的overlay键。

模板

默认情况下，Livewire Flash Container 组件已为您注册。您所需要做的就是将其包含在您的模板中。

<livewire:flash-container />

此包还包含一些示例警报组件（使用 TailwindCSS 样式）。但是，如果您不想使用这些...

自定义

您可以更改 Livewire 组件使用的视图以及应用于每种消息类型的样式。

如果您不使用 TailwindCSS 和/或 FontAwesome，您绝对应该这样做，以调用您自己的警报组件/部分，以适应您的技术栈。

首先，发布配置文件。

php artisan vendor:publish --provider="MattLibera\LivewireFlash\LivewireFlashServiceProvider"

然后，编辑views区域。

'views' => [
    'container' => 'livewire-flash::livewire.flash-container',
    'message'   => 'partials.my-bootstrap-flash',
],

您可以在模板中访问MattLibera\LivewireFlash\Message上的公共消息属性，以及$styles（通过 Livewire 组件注入）。

可关闭消息

默认情况下，每条消息都将设置为可关闭的（即在右端有一个 X 图标可以关闭警报）。如果您想阻止这种情况，可以在您的 flash 指令中链接 ->notDismissable()（或 ->dismissable(false)）。

如果您想通过 AlpineJS 或其他方式自动淡出消息，可以添加您自己的魔法 - 目前，每条消息都是一个 Livewire 组件，并使用 Livewire 逻辑在关闭时隐藏它。

请注意，叠加不支持此指令。

多个闪存消息

可以将多个闪存消息发送到会话中。

// anywhere
flash('Message 1');
flash('Message 2')->warning();

return redirect('somewhere');

或者

// livewire component
flash('Message 1')->livewire($this);
flash('Message 2')->warning()->livewire($this);

然而，目前，由于 Livewire 处理会话的方式，您不能混合使用...也就是说，您不能这样做

// livewire component
flash('Message 1'); // this one will get lost.
flash('Message 2')->livewire($this); // this one will show on current page via Livewire

贡献

我欢迎对这个包的贡献，并会尽我所能随着时间的推移维护它。拉取请求受到欢迎，实际上是被鼓励的。目前没有关于 PR 的具体指南。

路线图

关于未来版本的考虑因素

动态设置图标或颜色的流畅选项
自动关闭闪存消息的选项

致谢和许可

对原始包的致谢归功于 Jeffrey Way 和 Laracasts。额外的感谢

Caleb Porzio 和他的 Livewire 贡献者，因为他们出色的框架
Adam Wathan 和 Tailwind 团队
Taylor Otwell 和他的 Laravel 团队

这是一个 MIT 许可的包。请阅读 license.md 以获取详细信息。

mattlibera / livewire-flash

维护者

详情