Laravel 5 シリーズのチュートリアル 6: フォーム-PHPチュートリアル-php.cn

始める前に、インターフェースを美しくしましょう最初に少しずつ:

まず https://github.com/JellyBool/blog-css-js にアクセスして静的ファイルを取得し、次の 3 つのファイルをそれぞれ変更します:

以下ビューコードの修正部分は、面倒な方はctrl+cを使っても大丈夫です。

app.blade.php 内: 元の @yield('content') コードを次のコードに置き換えます:

1 つはブートストラップで、もう 1 つはカスタマイズされます。

タグに配置します。

@foreach($articles as $article)<article class="format-image group">    <h2 class="post-title pad">        <a href="/articles/{{ $article->id }}"> {{ $article->title }}</a>    </h2>    <div class="post-inner">        <div class="post-deco">            <div class="hex hex-small">                <div class="hex-inner"><i class="fa"></i></div>                <div class="corner-1"></div>                <div class="corner-2"></div>            </div>        </div>        <div class="post-content pad">            <div class="entry custome">                {{ $article->intro }}            </div>            <a class="more-link-custom" href="/articles/{{ $article->id }}"><span><i>更多</i></span></a>        </div>    </div></article>@endforeach

ログイン後にコピー

最後に、articles/show.blade .php ビューを変更します。ファイル:

@section('content')    <article class="format-image group">        <h2 class="post-title pad">            <a href="/articles/{{ $article->id }}" rel="bookmark"> {{ $article->title }}</a>        </h2>        <div class="post-inner">            <div class="post-content pad">                <div class="entry custome">                    {{ $article->content }}                </div>            </div>        </div>    </article>@endsection

ログイン後にコピー

最後に効果を見てみましょう:

チュートリアルが終わると、基本的には私のブログと同じようにブログを完成させることができます。小さな製品の。

OK、少し美化した後、テーマに入ります: Laravel でフォームを使用する。

前奏

記事を作成する必要があるため、SF の記事作成ページと同じように、まず記事作成ページを表示する必要があります: http://segmentfault

。

そのため、前の記事の内容を確認する必要があります。

ルートを登録し、routes.php に追加します。

Route::get('article/create','ArticleController@create');

ログイン後にコピー

article/ create を指定して、

 public function create()    {        return view('articles.create');    }

ログイン後にコピー

この create() メソッドは create.blade.php を直接ロードするため、このビューファイルを作成して、前のセクションに進みます。 views/articles/ フォルダーで、新しい create.blade.php を作成し、次のテスト内容を記述します:

@extends('app')@section('content')    <h1>撰写新文章</h1>@endsection

ログイン後にコピー

ブラウザーで http://blog.dev/article/create にアクセスしてみます:

すべてが正しくロードされた後、フォームの使用を開始します。記事を作成するとき、コンテンツを受信できるようにフォームを送信する必要があるためです。Web アプリケーションでは実行できないことがほとんどあります。フォームなしでは、ユーザー情報を収集する必要がある場合や、UGC を期待する場合には、登録ページやログインページでもフォームの存在が必要になります。それでは、Laravel のフォームを使用してみましょう。

illuminate/html を使用します

ここでは公式パッケージを使用します: https://github.com/illuminate/html

composer を通じてインストールします:

composer require illuminate/html

ログイン後にコピー

インストールが成功したら、このパッケージがインストールされたことを Laravel にどのように通知すればよいでしょうか?あるいは、このパッケージをLaravelのシステム全体とどのように組み合わせるのでしょうか?

サービスプロバイダーを提供し、ファサードを指定することによって!これはLaravelと完全に組み合わせることができます。

なぜサービスプロバイダーとファサードを直接呼ぶのでしょうか?私はこれら 2 つを適切に翻訳する方法を知っているので、それを理解させてください

ところで、もう 1 つ言いたいのですが、PHP の多くのコンポーザーパッケージでは、各フレームワークの異なるバージョンが存在します。、HtmlPurifier など HTML をフィルタリングし、XSS を防止するためのこのパッケージには、次の Laravel バージョンがあります:
https://github.com/mewebstudio/Purifier。多かれ少なかれ、いくつかの優れたパッケージには Laravel バージョンがあります。

構成

サービスプロバイダーとファサードについて説明します。最初はサービスプロバイダーの概念について混乱するかもしれませんが、今はまったく心配する必要はありません。構成を開くだけです。 /app.php ファイルを見てください:

'providers' => [            Illuminate\Foundation\Providers\ArtisanServiceProvider::class,            Illuminate\Auth\AuthServiceProvider::class,            Illuminate\Broadcasting\BroadcastServiceProvider::class,            //...            ]

ログイン後にコピー

プロバイダー配列には、よく使用する Auth、Controller などの Laravel プリセットサービスプロバイダーが多数あることがわかります。ここで見つかります。さらに下にスクロールすると、次のようなエイリアス配列も表示されます。

'aliases' => [    'App'       => Illuminate\Support\Facades\App::class,    'Artisan'   => Illuminate\Support\Facades\Artisan::class,    'Auth'      => Illuminate\Support\Facades\Auth::class,    //...    ]

ログイン後にコピー

エイリアスは実際にはショートカットです。ここでショートカットを指定すると、たとえば、Laravel でグローバルに使用できます。コード内で Auth を使用します。実際には舞台裏で IlluminateSupportFacadesAuth::class を使用しています。さらに詳しく見て、実際にはプロバイダーで IlluminateAuthAuthServiceProvider::class を使用しています。

上でこれを書いている間に、illuminate/html がダウンロードされました:

次に、上記の方法に従って、config で、illuminate/html を設定しましょう。サービスを追加します。 /app.php のプロバイダーからプロバイダーへ:

Illuminate\Html\HtmlServiceProvider::class,

ログイン後にコピー

構成はおそらく次のようになります:

OK、サービスプロバイダーを追加したら、追加しましょうファサード、つまりエイリアス値の後に追加します:

'Form'      => Illuminate\Html\FormFacade::class,

ログイン後にコピー

設定後、次のような図を確認してください:

Use Forms

これら 2 つを設定したら、create.blade.php ビューで使用できます:

@section('content')    <h1>撰写新文章</h1>    {!! Form::open() !!}    {!! Form::close() !!}@endsection

ログイン後にコピー

2 つの行 {!! Form:: open() !!} と {!! Form ::close() !!}。{!! に類似した記号については、blade の {{ を参照してください。あまり心配しないでください。もう一度 http://blog.dev/article/create にアクセスしてみましょう:

咋一看，貌似没有什么变化，但是你要查看页面源码或者使用开发者工具检查元素的时候，就可以发现这个form元素已经创建出来了。

不难发现，Laravel的Form还默认为我们生成一个hidden的表单(name="_token")，这个是Laravel默认对表单提交的一点安全支持。在表单提交的时候，Laravel会自动检查这个_token是否与保存在session中的_token一致，如果不一致，那就直接跳转回远页面，不允许我们提交数据。

既然Form可以正常使用了，我们就可以创建我们需要的表单了：

{!! Form::open() !!}   <div class="form-group">       {!! Form::label('title','标题:') !!}       {!! Form::text('title',null,['class'=>'form-control']) !!}   </div>   <div class="form-group">       {!! Form::label('content','正文:') !!}       {!! Form::textarea('content',null,['class'=>'form-control']) !!}   </div>   <div class="form-group">       {!! Form::submit('发表文章',['class'=>'btn btn-success form-control']) !!}   </div>{!! Form::close() !!}

ログイン後にコピー

我们在{!! Form::open() !!}加入一点东西，先来看看我们的效果：

下面详细解释一下：

{!! Form::text('title',null,['class'=>'form-control']) !!}

ログイン後にコピー

拿这个来开刀吧：

Form::text 表示，还要一堆比如等你可以参照着写。

'title' 表示 name='title'

null 表示 value=''

'class'=>'form-control' 表示class='form-control'，这里可以指定id，placeholder等一系列你想指定的属性

然而在Form::open()没有指定提交路径的情况之下，默认是提交到本页面，这样对于我们的清晰分工是不太好的，因为这个页面就是用来加载视图的，而对于我们表单提交的内容，我们希望用另外的方法来处理，所以我们来写一写吧。

首先在Form::open()指定表单提交的url，直接在加入url：

{!! Form::open(['url'=>'article/store']) !!}

ログイン後にコピー

我们指定表单post提交到article/store这个地址，然后在routes.php注册这个路由地址：

Route::post('article/store','ArticleController@store');

ログイン後にコピー

这里注意我们使用了Route::post而不是Route::get，这是用来接收post的路由。然后顺利成章，在ArticleController中创建store()方法：

public function store()    {        $input = Request::all();        return $input;    }

ログイン後にコピー

在这个方法中，我们引入Laravel自带的Request并使用Request::all()，来获取所有的用户提交的过来的内容(这里指的是：_token,name很content)，如果你想获取具体某一个表单输入的内容，可以使用Request::get()，比如Request::get('title')，然后直接return来看看用户到底输入了什么内容，我们来试试：

实现创建新文章

OK，成功拿到用户的提交的内容之后，我们需要将这些保存到数据库，怎么实现呢？在第四篇中，我们提到的Eloquent的create()方法现在就可以派上用场了，于是我们可以写成这样：

Article::create($input);

ログイン後にコピー

Laravel会自动过滤_token这个提交内容。

但是创建完一篇文章之后，我们并不是想return $input，而是想重新跳转到某个页面中，比如我们的首页，因为发表完文章，我们需要看到它是否成功出线在文章列表中，所以我们最后写一下：

public function store()    {        $input = Request::all();        Article::create($input);        return redirect('/');    }

ログイン後にコピー

我们直接使用Laravel的redirect()函数进行跳转，跳转到首页。这个时候，短短的三行代码就可以将我们的逻辑实现了，那么我们来试试：

貌似成功了？但是我们觉得这个排序有点问题，最新创建的文章当然是在最上面的了，所以我们到ArticleController的index()方法中稍微修改一下：

public function index()    {        $articles = Article::latest()->get();        return view('articles.index',compact('articles'));    }

ログイン後にコピー

将原来的all()换成了latest()->get()，刷新，

我们发现，最新的文章intro竟然空白，我们到数据库看看：

我们发现，刚刚创建的文章的intro为空值，而published_at为0000-00-00 00:00:00,这不是我们想要的，为什么会这样呢？因为我们在提交过来的时候，并没有这两个数据啊，为了解决这个问题，首先我们可以很暴力得将这两个数据在使用Article::create($input)之前配置好，比如：

public function store()    {        $input = Request::all();        //下面增加两行，顺便看看Request::get的使用        $input['intro'] = mb_substr(Request::get('content'),0,64);        $input['published_at'] = Carbon::now();        Article::create($input);        return redirect('/');    }

ログイン後にコピー

intro字段就直接取content字段的头64个，然后published_at就默认为创建的时间。目前开起来代码有点暴力，但是不失为一种解决方案，我们后续会使代码much cleaner。我们再来试试：

bang，成功了，我们在看看数据库：

到这里，我们创建一篇文章的基本流程就完成了，但是这里还有一个问题，如果你尝试在文章创建的页面什么都不填，直接提交数据，你看看会发生什么，如果不确定，你可以看看你的数据库，到底发生了什么。

鉴于最后的问题和牵涉到表单的内容，下一节貌似很顺理成章就应该说说表单验证了，在Laravel中就是Request Validation。

最后，

Happy Hacking