搜索
首页后端开发php教程[Laravel 5 Fundamentals] 20 – Flash Message

Flash Message

前言

上一节,我们对 Laravel 前端的 assets 一个了解,Laravel 的前端管理利器: elixir + gulp 。本节回到 php 方面,对 flash message 的使用做一个讲解。

说明

开发环境:Windows 7

Laravel 版本: 5+

IDE: Phpstorm

什么是 flash message , flash , 闪烁,稍纵即逝,message ,消息。大概其直译就是“闪信”,其原先是出自 rails 的,用于在页面上显示一些提示信息。在 Laravel 里引入这个概念,对页面上需要的信息做一个提示。

当用户在你的网站上做了什么行为之后,你要对其行为做一个响应回复。比如注册了,那你得提示“注册成功”,不是 js alert() 的效果,但是 alert() 的用意。

在我们的博客系统中或许就可以用到。党我们新创建完一篇文章之后,就会立马跳转至文章列表页面,比较突兀。来一个提示多好,提示我创建完成——虽然我知道创建完成了。

添加 flash message

首先,打开 ArticlesController.php ,找到 store() 方法,我们实现存储写好的文章的方法就在此。代码如下:

public function store(ArticleRequest $request)    {        $article = new Article($request->all());        Auth::user()->articles()->save($article);        return redirect('articles');    } 

当文章创建成功后,页面会 redirect 到 /articles ,此时,我们可以在 session 中创建一个 flash message 的对象,包装在一个 k-v 中:

public function store(ArticleRequest $request)    {        $article = new Article($request->all());        Auth::user()->articles()->save($article);        \Session::flash('flash_message','Your article has been created!');        return redirect('articles');    } 

至此,还不能显示,只是在 session 中加入了一个键值对,想显示那就得根据 k 来提取 v 。这里的 session 之所以有一个 flash() 方法,是因为 Laravel 框架里面写好了,你也可以写一个 Session::put ,这个和 flash 的区别就在于,flash是“一锤子买卖”,一个请求一个 flash message ,当你 reload 页面,该 flash message 就消失了,但是 put 不同。

展示 flash message

我们来到我们的 master.blade.php 中,这里定义了我们所有布局文件的格式。我们在这里添加如下代码:

<divclass="container">                                                                @if (Session::has('flash_message'))                                                    <divclass="alert alert-success">                                                          {{Session::get('flash_message')}}                                          </div>      @endif    @yield('content')                                                              </div>                                                                              <divclass="footer">                                                                    @yield('footer')                                                                </div>   

在原先的 content 上面加一个逻辑语句,来判断 session 对象中是不是有一个名为 ‘flash_message’ 的 key , 有的话提取出来显示在 content 上面。

至此,我们的 flash message j就可以显示了。启动服务器,访问 localhost:8888/articles/create 登陆后,发表文章,然后你会看到顶上的绿色提示。当你 reload 该页面,提示消失。 flash ~

消失 flash message

没错,每次 reload 页面,这是什么坑爹做法? 怎么办? 那就给它添加一个叉号,或者定时消失。

叉掉 flash message

先看叉号。

在刚才的 blade 里面添加这么一句:

<divclass="container">                                                                @if (Session::has('flash_message'))                                                    <divclass="alert alert-success">                                                          <buttontype="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>                {{Session::get('flash_message')}}                                          </div>      @endif    @yield('content')                                                              </div>                <scriptsrc="//code.jquery.com/jquery.js"></script>                        <scriptsrc="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <divclass="footer">                                                                    @yield('footer')</div> 

做了两个动作,第一,在下面引入两个 js 文件,第二在上面添加一段 button 控件的代码,意思也很明朗。

再去浏览器访问 localhost:8888/articles/create ,创建完成后,可以看到有一个小叉在提示的右上角,而且点击后消失,免去了 reload 页面。

自动消失 flash message

下面一种逻辑,提示分为两种,一种是重要的,一种是不重要的,不重要的让它自己按时间消失,重要的让用户去点叉。

好的,下面看一下怎么实现:

<divclass="container">    @if (Session::has('flash_message'))        <divclass="alert alert-success {{ Session::has('flash_message_important') ? 'alert-important':''}}">                @if (Session::has('flash_message_important'))                        <buttontype="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>                @endif                {{Session::get('flash_message')}}        </div>    @endif    @yield('content') </div><scriptsrc="//code.jquery.com/jquery.js"></script><scriptsrc="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script><script>        $('div.alert').not('.alert-important').delay(3000).slideUp(300);</script> <divclass="footer">    @yield('footer') </div> 

首先,在

这里对 session 中的 key 做一个判断,如果有一个名为 flash messageimportant 的 key ,则给 div 继续添加一个 alert-important 的类属性,否则不添加。

@if (Session::has('flash_message_important'))                        <buttontype="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>@endif 

而就一句的意思就是说,如果有重要的 flash_message ,那么就显示一个叉号。

最后还添加了一段 jquery 的 js , 用来 div 的自动消失。逻辑是若果不是重要消息,那么展示3s后,自动消失。

各位可以在 localhost:8888/articles/create 中创建完之后看看效果。

如果想看点叉的效果的话,回到 ArticlesController.php,在\Seesion下面添加一句

\Session::flash(‘flash messageimportant’,true); 保存再创建文章试试看~

另一种添加 flash message 的方式

添加 session 还有一种方法。打开 ArticlesControler.php ,添加如下代码:

public function store(ArticleRequest $request)                                      {                                                                                      $article = new Article($request->all());                                            Auth::user()->articles()->save($article);                                           //\Session::flash('flash_message','Your article has been created!');                //\Session::flash('flash_message_important',true);         return redirect('articles')->with([                                                    'flash_message'=>'Your article has been created!',                                  'flash_message_important'=>true]);     }               

这样也是ok的。

总结

flash mesage 作为提示方式在 web 设计中起着人性化的一面,给用户的选择更多,更贴心,交互感更好。

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
PHP类型提示如何起作用,包括标量类型,返回类型,联合类型和无效类型?PHP类型提示如何起作用,包括标量类型,返回类型,联合类型和无效类型?Apr 17, 2025 am 12:25 AM

PHP类型提示提升代码质量和可读性。1)标量类型提示:自PHP7.0起,允许在函数参数中指定基本数据类型,如int、float等。2)返回类型提示:确保函数返回值类型的一致性。3)联合类型提示:自PHP8.0起,允许在函数参数或返回值中指定多个类型。4)可空类型提示:允许包含null值,处理可能返回空值的函数。

PHP如何处理对象克隆(克隆关键字)和__clone魔法方法?PHP如何处理对象克隆(克隆关键字)和__clone魔法方法?Apr 17, 2025 am 12:24 AM

PHP中使用clone关键字创建对象副本,并通过\_\_clone魔法方法定制克隆行为。1.使用clone关键字进行浅拷贝,克隆对象的属性但不克隆对象属性内的对象。2.通过\_\_clone方法可以深拷贝嵌套对象,避免浅拷贝问题。3.注意避免克隆中的循环引用和性能问题,优化克隆操作以提高效率。

PHP与Python:用例和应用程序PHP与Python:用例和应用程序Apr 17, 2025 am 12:23 AM

PHP适用于Web开发和内容管理系统,Python适合数据科学、机器学习和自动化脚本。1.PHP在构建快速、可扩展的网站和应用程序方面表现出色,常用于WordPress等CMS。2.Python在数据科学和机器学习领域表现卓越,拥有丰富的库如NumPy和TensorFlow。

描述不同的HTTP缓存标头(例如,Cache-Control,ETAG,最后修饰)。描述不同的HTTP缓存标头(例如,Cache-Control,ETAG,最后修饰)。Apr 17, 2025 am 12:22 AM

HTTP缓存头的关键玩家包括Cache-Control、ETag和Last-Modified。1.Cache-Control用于控制缓存策略,示例:Cache-Control:max-age=3600,public。2.ETag通过唯一标识符验证资源变化,示例:ETag:"686897696a7c876b7e"。3.Last-Modified指示资源最后修改时间,示例:Last-Modified:Wed,21Oct201507:28:00GMT。

说明PHP中的安全密码散列(例如,password_hash,password_verify)。为什么不使用MD5或SHA1?说明PHP中的安全密码散列(例如,password_hash,password_verify)。为什么不使用MD5或SHA1?Apr 17, 2025 am 12:06 AM

在PHP中,应使用password_hash和password_verify函数实现安全的密码哈希处理,不应使用MD5或SHA1。1)password_hash生成包含盐值的哈希,增强安全性。2)password_verify验证密码,通过比较哈希值确保安全。3)MD5和SHA1易受攻击且缺乏盐值,不适合现代密码安全。

PHP:服务器端脚本语言的简介PHP:服务器端脚本语言的简介Apr 16, 2025 am 12:18 AM

PHP是一种服务器端脚本语言,用于动态网页开发和服务器端应用程序。1.PHP是一种解释型语言,无需编译,适合快速开发。2.PHP代码嵌入HTML中,易于网页开发。3.PHP处理服务器端逻辑,生成HTML输出,支持用户交互和数据处理。4.PHP可与数据库交互,处理表单提交,执行服务器端任务。

PHP和网络:探索其长期影响PHP和网络:探索其长期影响Apr 16, 2025 am 12:17 AM

PHP在过去几十年中塑造了网络,并将继续在Web开发中扮演重要角色。1)PHP起源于1994年,因其易用性和与MySQL的无缝集成成为开发者首选。2)其核心功能包括生成动态内容和与数据库的集成,使得网站能够实时更新和个性化展示。3)PHP的广泛应用和生态系统推动了其长期影响,但也面临版本更新和安全性挑战。4)近年来的性能改进,如PHP7的发布,使其能与现代语言竞争。5)未来,PHP需应对容器化、微服务等新挑战,但其灵活性和活跃社区使其具备适应能力。

为什么要使用PHP?解释的优点和好处为什么要使用PHP?解释的优点和好处Apr 16, 2025 am 12:16 AM

PHP的核心优势包括易于学习、强大的web开发支持、丰富的库和框架、高性能和可扩展性、跨平台兼容性以及成本效益高。1)易于学习和使用,适合初学者;2)与web服务器集成好,支持多种数据库;3)拥有如Laravel等强大框架;4)通过优化可实现高性能;5)支持多种操作系统;6)开源,降低开发成本。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 个月前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
1 个月前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
1 个月前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它们
1 个月前By尊渡假赌尊渡假赌尊渡假赌

热工具

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

将Eclipse与SAP NetWeaver应用服务器集成。

安全考试浏览器

安全考试浏览器

Safe Exam Browser是一个安全的浏览器环境,用于安全地进行在线考试。该软件将任何计算机变成一个安全的工作站。它控制对任何实用工具的访问,并防止学生使用未经授权的资源。

Atom编辑器mac版下载

Atom编辑器mac版下载

最流行的的开源编辑器

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

Dreamweaver Mac版

Dreamweaver Mac版

视觉化网页开发工具