まえがき
前のセクションでは、Laravel フロントエンドアセット、Laravel のフロントエンド管理ツール elixir + gulp について理解しました。このセクションでは PHP に戻り、フラッシュ メッセージの使用方法について説明します。
手順
開発環境: Windows 7
Laravelバージョン: 5+
IDE: Phpstorm
フラッシュメッセージ、フラッシュ、フラッシュ、一瞬、メッセージ、メッセージとは。おそらく直訳すると「フラッシュ メッセージ」になります。これは元々は Rails に由来し、ページ上に何らかのプロンプト情報を表示するために使用されます。この概念を Laravel に導入し、ページ上で必要な情報の入力を求めるプロンプトを作成します。
ユーザーがウェブサイト上で何かをしたとき、あなたは彼らの行動に応答する必要があります。たとえば、登録する場合は、「登録が成功しました」というプロンプトが表示される必要がありますが、これは jsのalert()の効果ではなく、alert()の意図によるものです。
もしかしたらブログシステムでも使えるかもしれません。新しい記事を作成すると、すぐに記事一覧ページにジャンプしますが、これはかなり唐突です。たとえそれが完了しているとわかっていても、作成が完了したことを思い出させてくれるのは、とてもうれしいことです。
まず、ArticlesController.php を開いて、store() メソッドを見つけます。これが、書かれた記事を保存するメソッドを実装する方法です。コードは次のとおりです:
public function store(ArticleRequest $request) { $article = new Article($request->all()); Auth::user()->articles()->save($article); return redirect('articles'); }
記事が正常に作成されると、ページは /articles にリダイレクトされます。この時点で、セッション内に Flash メッセージ オブジェクトを作成し、それを 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'); }
これまでのところ、まだ表示できません。表示したい場合は、k に基づいて v を抽出する必要があります。ここでセッションに flash() メソッドがある理由は、これが Laravel フレームワークで記述されているためです。これとフラッシュの違いは、フラッシュが「ワンショット ディール」であることです。リクエストごとに 1 つのリクエストの場合、ページをリロードするとフラッシュ メッセージは消えますが、put は異なります。
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>
論理ステートメントを元のコンテンツに追加して、セッション オブジェクトに「flash_message」という名前のキーがあるかどうかを判断します。存在する場合は、それを抽出してコンテンツに表示します。
この時点で、フラッシュメッセージ j が表示されます。サーバーを起動し、localhost:8888/articles/create にアクセスし、ログインして記事を公開すると、上部に緑色のプロンプトが表示されます。ページをリロードすると、プロンプトが表示されなくなります。 flash ~
はい、ページをリロードするたびに、これはどのような不正行為ですか? 何をするか? その後、それに十字を追加するか、定期的にそれを消します。
まず十字を見てください。
今ブレードに次の文を追加します:
<divclass="container"> @if (Session::has('flash_message')) <divclass="alert alert-success"> <buttontype="button" class="close" data-dismiss="alert" aria-hidden="true">×</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>
2 つのアクションを作成しました。最初に、以下の 2 つの js ファイルを導入し、2 番目に、上にボタン制御コードを追加します。意味も非常に明確です。
ブラウザに移動し、localhost:8888/articles/create にアクセスします。作成が完了すると、プロンプトの右上隅に小さな十字が表示され、クリックすると消えるため、ページをリロードする必要がなくなります。 。
以下のロジックに従って、プロンプトは重要なものと重要でないものに分けられ、重要でないものは時間に応じて自動的に消え、重要なものはユーザーに表示されます。十字をクリックします。
それでは、実装方法を見てみましょう:
<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">×</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>
まず、セッション内のキーを判断します
という名前のキーがある場合は、div クラスにアラート-重要を追加します。属性を指定しない場合は追加されません。
@if (Session::has('flash_message_important')) <buttontype="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>@endif
この文の意味は、重要な flash_message がある場合はバツ印が表示されるということです。
最後に、div を自動的に消すための jquery js の一部が追加されます。重要なメッセージでない場合は、3 秒間表示された後、自動的に消えるというロジックです。
localhost:8888/articles/create で作成した後の効果を確認できます。
クロスの効果を確認したい場合は、ArticlesController.php に戻って文を追加してください
Session::flash('flash message important',true); 記事を保存して作成して試してみてください~
セッションを追加する別の方法があります。 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 メッセージは、Web デザインにおいて人間的な側面を果たし、ユーザーにより多くの選択肢、より思慮深い、より良いインタラクションを提供します。