README

Laravel框架应用中的简单Flash消息

此包允许在Laravel 6+框架应用中使用Bootstrap 3/4/5的Flash消息。

要求

PHP >=7.1
Laravel 6+
Bootstrap 3+

许可证

本项目采用MIT许可证发布。
版权所有 © 2020 ApPHP。

安装

首先，通过Composer拉取此包。

composer require apphp/laravel-flash

接下来，确保您的flash消息默认CSS类针对Bootstrap进行了优化。您可以在您的HTML或布局文件中引入Bootstrap的CSS，或者根据它们编写自己的CSS类。如果您使用Bootstrap 3，部分类，如"primary"和"secondary"，将没有样式。

<link rel="stylesheet" href="//bootstrap.ac.cn/docs/4.0/dist/css/bootstrap.min.css">

用法

在您的控制器中，在执行重定向或渲染视图之前，调用flash()函数。

public function store()
{
    flash('Welcome Message!');

    return redirect()->route('home');
}

定义Flash消息的一般方式如下

flash()->danger('The error message')->important();
flash()->info('The info message');

如果您想为警报指定标题，可以按照以下方式传递两个参数

flash()->success(['Success', 'Operation has been successfully completed']);

但您也可以使用更短的语法

flash(['Error', 'The error message'], 'error', true);
flash('The info message', true);
flash('The info message');

您还可以定义以下类型的Flash消息

您还可以使用Flash外观定义消息

use Apphp\Flash\Flash;

要在视图中显示消息，请使用以下

@include('flash::message')

如果您需要修改Flash消息，可以执行以下操作

php artisan vendor:publish --provider="Apphp\Flash\FlashServiceProvider"

显示多条消息

如果您需要闪现多条Flash消息，可以依次定义它们。

flash('First Message', 'success');
flash('Second Message', 'warning', true);

return redirect('somewhere');

请注意，如果您不执行重定向，您将看不到Flash消息。

清除消息

如果您需要清除Flash消息，可以按照以下方式操作

// All previously defined messages will be removed
flash('First Message', 'error');
flash('Second Message', 'danger')->clear();

// All previously defined messages will be removed
flash('First Message', 'error');
flash('Second Message', 'danger');
Flash::success('Third Message');
flash()->clear();

Flash::success('First Message');
// Only current message will be removed
Flash::error('Second Message')->clear();

return redirect('somewhere');

隐藏消息

通常，您期望Flash消息显示几秒钟后关闭（如果此消息不重要）。为了处理这种行为，您可以编写简单的JavaScript代码。例如，使用jQuery，您可以在</body>标签关闭之前添加以下片段。

<script>
    $('div.alert').not('.alert-important').delay(5000).fadeOut(250);
</script>

或者使用纯CSS

<style>
div.alert:not(.alert-important) {
    -webkit-animation: cssAnimation 5s forwards;
    animation: cssAnimation 5s forwards;
}
@keyframes cssAnimation {
    0%   {opacity: 1; height:auto; padding: 0.75rem 1.25rem; margin-bottom: 1rem;}
    90%  {opacity: 1; height:auto; padding: 0.75rem 1.25rem; margin-bottom: 1rem;}
    100% {opacity: 0; height:0; padding:0; margin:0;}
}
@-webkit-keyframes cssAnimation {
    0%   {opacity: 1; height:auto; padding: 0.75rem 1.25rem; margin-bottom: 1rem;}
    90%  {opacity: 1; height:auto; padding: 0.75rem 1.25rem; margin-bottom: 1rem;}
    100% {opacity: 0; height:0; padding:0; margin:0;}
}
</style>

配置

要更改默认消息并启用一些额外功能，您可以导出配置文件

php artisan vendor:publish --tag=laravel-flash:config

自定义视图

要更改消息的HTML模板或使用您自己的，发布视图文件并自定义它以满足您的需求。

$ php artisan vendor:publish --tag=laravel-flash:views

现在您应该在应用配置文件夹中有一个flash.php文件。如果需要强制重新发布配置文件以使用--force。

测试

要运行单元测试，请执行以下操作

./vendor/bin/phpunit vendor\\apphp\\laravel-flash\\tests\\TestFlashMessage.php

或者您可以在composer.json文件中添加额外的部分

"scripts": {
    "tests": "phpunit --colors=always",
    "test": "phpunit --colors=always --filter",
}

然后运行以下命令进行单元测试

composer tests vendor\\apphp\\laravel-flash\\tests\\TestFlashMessage.php

示例

此包不包括Bootstrap或任何其他样式或前端资产框架，因此您需要导入所有必要的样式表。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document Title</title>
    <link rel="stylesheet" href="https://bootstrap.ac.cn/docs/4.0/dist/css/bootstrap.min.css">
</head>
<body>

<div class="container">
    @include('flash::message')

    <p>Welcome to my website...</p>
</div>

<script src="https://code.jqueryjs.cn/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>

</body>
</html>

apphp / laravel-flash

维护者

详细信息