正文

Laravel建站03--建立前台文章列表和文章详情

IP云
IP云V管理员/5 阅读
11/29
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

经过了前面的开发环境搭建和数据库配置、git配置的准备工作以后，现在可以开始动作做点什么了。

先从简单的开始，那就先来个文章列表和详情页吧。

这期间可以学习到路由、建立model、controller还有view的写法。

建立model 

php artisan make:model Article

model文件目录是（基于Laravel5.4）app。目前简单例子中并不会在model中写点什么，但是没它不行。

建立数据表 

php artisan make:migration create_article_table

执行以上命令后，会在database/migrations下生成2*_create_article_table.php文件。修改它的up方法： 

public function up()

{

    Schema::create('articles', function(Blueprint $table)

    {

        $table->increments('id');

        $table->string('title');

        $table->text('body')->nullable();

        $table->integer('user_id');

        $table->timestamps();

    });

}

然后执行以下命令 

php artisan migrate

数据库中会出现article表了。

建立controller 

php artisan make:controller ArticleController

controller目录是app/Http/ 。以上语句执行成功后，会在该目录建立ArticleControllser.php

暂时只需要列表和详情两个方法。所以只需在ArticleControllser里写两个方法就够了。 

    public function index()

    {

        $articles = DB::table('articles')

                ->select('id', 'body', 'title')

                ->orderBy('id', 'desc')

                ->paginate(5);

        return view('welcome', ['articles' => $articles]);

    }

    public function show($id)

    {

        return view('article')->withArticle(Article::find($id));

    }

还要添加两个引用： 

use Illuminate\Support\Facades\DB;

use App\Article;

index方法是列表，这里通引用的db来查询数据库，指定了表、列和排序字段，最简单的是用gaginate(5)就可以实现翻页了。

当数据量大时可以用 simplePaginate 来实现 上一页/下一页的简单分页，这样速度会比较快。

show方法是显示文章详情，这里用article的model的find方法来实现，所以需要引用article的model。

建立view

Laravel的view就是自己手动创建的。文件目录是resources/views/ 。文件名一定是以.blade.php结尾的。

这里建立article.blade.php当做文章详情页，用自带的首页welcome.blade.php当文章列表页。

列表写法： 

@foreach ($articles as $article)

<li style="margin: 50px 0;">

    <div class="title">

        <a href="{{ url('article/'.$article->id) }}">

            <h4>{{ $article->title }}</h4>

        </a>

    </div>

    <div class="body">

        <p>{{ $article->body }}</p>

    </div>

</li>

@endforeach

分页写法： 

{{ $articles->links() }}

以上就是列表的写法，虽然简陋，但是可以看出很简单就可以实现列表和翻页。

详情页写法： 

<h1 style="text-align: center; margin-top: 50px;">{{ $article->title }}</h1>

<hr>

<div id="date" style="text-align: right;">

    {{ $article->updated_at }}

</div>

<div id="content" style="margin: 20px;">

    <p>

        {{ $article->body }}

    </p>

</div>

以上就是view中涉及到动态内容的写法。其他就把它当做html写就可以了。

配置路由

路由目录是routes/ 这里配置目录下的web.php，为其增加文章详情的路由。 

Route::get('/', 'ArticleController@index');

Route::get('article/{id}', 'ArticleController@show');

注释掉默认的'/'的处理。这样首页就可以进入articlecontroller的index方法，而详情页就进入show方法。

至此，前台文章列表和详情的页面已经写完。个人理解重点的代码就是以上那么多。源代码可以在我的 GitHub 上找到。

欢迎交流。

相关阅读

目录[+]