粉丝视图页面

关注人列表和粉丝列表页面

接下来需要新增一个 users/show_follow 视图来用于数据展示。该视图的页面结构如下。

resources/views/users/show_follow.blade.php

@extends('layouts.default')
@section('title', $title)

@section('content')

  
{{ $title }}
  

    @foreach ($users as $user)
      

        
        {{ $user->name }}
      
    @endforeach
  

  {!! $users->render() !!}

@stop

统计信息页面

resources/views/shared/_stats.blade.php

  
    
      {{ count($user->followings) }}
    
    关注
  
  
    
      {{ count($user->followers) }}
    
    粉丝
  
  
    
      {{ $user->statuses()->count() }}
    
    微博
  

我们通过调用 Eloquent 模型的 count 方法来获取用户发布过的微博数，这个做法并不算是最佳实践，因为在大型应用中，为了节省服务器资源，优化数据库查询效率，常会采用的方法是在数据库中添加一个模型计数器字段，在每次对模型进行创建或删除时对该字段进行更新，而由于本书开发的应用只是小型的演示应用，因此在这里我们使用 count 方法来查询即可。

将视图添加到首页上进行显示

resources/views/static_pages/home.blade.php

@extends('layouts.default')

@section('content')
  @if (Auth::check())
    

      

        

          @include('shared._status_form')
        
        
微博列表
        @include('shared._feed')
      
      

        

          @include('shared._user_info', ['user' => Auth::user()])
        
        

          @include('shared._stats', ['user' => Auth::user()])
        
      
    
  @else
    

      
Hello Laravel
      

        你现在所看到的是 Laravel 入门教程 的项目主页。
      
      

        一切，将从这里开始。
      
      

        现在注册
      
    
    
  @endif
@stop

样式调整

resources/assets/sass/app.scss

.
.
.
/* sidebar */
.
.
.
.stats {
  overflow: auto;
  margin-top: 0;
  padding: 0;
  a {
    float: left;
    padding: 0 10px;
    text-align: center;
    width: 33%;
    border-left: 1px solid $gray-lighter;
    color: gray;
    &:first-child {
      padding-left: 0;
      border: 0;
    }
    &:hover {
      text-decoration: none;
      color: #337ab7;
    }
  }
  strong {
    display: block;
    font-size: 1.2em;
    color: black;
  }
}

.user_avatars {
  overflow: auto;
  margin-top: 10px;
  .gravatar {
    margin: 1px 1px;
  }
  a {
    padding: 0;
  }
}

.users.follow {
  padding: 0;
}

/* forms */

#follow_form button {
  margin: 0 auto;
  display: block;
  margin-top: 25px;
}
.
.
.