[Laravel] 顯示文章到前台

我們現在的posts頁面內容還是hard code寫死的
接下來就要把寫入的內容給顯示在畫面上


上次寫入好幾筆資料之後
我們要修改當初的posts頁面

第一步是看到 PostsController.php
原先直接導向寫死的 index 頁面
為了讓畫面能顯示後台的資料,我們必須傳遞參數給前台
將 PostsController 改為

public function index() 

    $posts = Post::latest()->get();
    return view('posts.index', compact('posts'));
}

如此把Post的所有資料使用 compact的方式命名為 posts 傳給 posts.index
並且採取新的資料在上面的方法

接著是view的部分
上次我們已經把內容分離出來做為 index.blade.php的 content部分
我們把 @section('content')內容全部刪除
並且用

<div class="col-sm-8 blog-main">
    @foreach($posts as $post)
        @include('posts.post')
    @endforeach
</div>

取代後我們就會把 $posts 內容逐條讀取
並且引入 posts.post ,這之中就是存放我們要顯示內容的方式

posts.post
直接就是

<div class="blog-post">
    <h2 class="blog-post-title">
        <a href="/posts/{{ $post->id }}">
            {{ $post->title }}
        </a>
    </h2>
    
    <!-- 時間顯示 -->
    <p class="blog-post-meta">
        {{ $post->created_at->toFormattedDateString() }}
    </p>

    {{ $post->body }}
</div>

單就每則內文來做顯示
我們用到 toFormattedDateString()
這是一個 Laravel 5 預載的插件 Carbon作為時間型別轉換用
參考說明

並且我們在頁面上加入了標題的超連結,可以快速連結到該篇文章

我們解開之前 routes 中註解起來的

Route::get('/posts/{posts}', 'PostsController@show');

現在我們的超連結可以導向某個 id 的 show 頁面了
上次 show 頁面也是寫死的
所以我們再次的修改 PostController 的 show 方法

public function show($id)

    $posts = Post::find($id);
    return view('posts.show', compact('post'));
}

最後就是 show.blade.php 這隻檔案
一樣改寫 @section('content') 裡面的內容
<div class="col-sm-8 blog-main">
    <h1>{{ $post->title }}</h1>
    {{ $post->body}}
</div>

然後刷新頁面,又可以看見剛剛的posts頁面上的超連結可以進入指定頁面
並且,新增的文章會在最上面


留言