您可以利用 phpGrace 提供的视图小部件功能来开发视图部件，如 : 分页部件、轮播图部件、新闻排行部件等等。
注意 : 视图小部件是针对视图的，在 api 类不具备视图文件的项目内没有使用的意义。
命令 : php grace cwt 部件名称
创建部件对应的文件位置及结构
/appWidget/ /部件目录 /widget.php // 数据及业务逻辑文件 /view.php // 视图文件
在命令创建的基础上完善小部件，注意 :
1 类名称命名空间不能改变； 2 小部件类最终利用静态方法 embed() 对外暴露； 3 类内部使用静态变量及静态方法完成全部功能； 4 视图文件包含 html 结果 js css 3个部分，按实际情况完善，不需要则删除即可； 5 请严格遵循 embed() 函数结构，内置了一个参数 $data 用于数据传递，如果有多个数据需要传递给部件请使用数组； 6 在小部件视图内使用 self::$data 来获取传递的数据；
视图小部件应该在视图内部嵌入，嵌入方法 : $控制器对象->__widget('部件名称', $数据 [ 可选参数 默认 null ])；
/appWidget/paging/widget.php
<?php
/**
* 功能 : 分页部件
* 作者 : grace
* 版本 : 1.0
*/
namespace widget\paging;
class widget{
protected static $data;
public static function embed($data = null){
self::$data = $data;
// your code here ...
include 'view.php';
}
}/appWidget/paging/view.php
<div class="pager-list"> <?php echo self::$data['firstPage'];?> <?php echo self::$data['prePage'];?> <?php echo self::$data['listPages'];?> <?php echo self::$data['nextPage'];?> <?php echo self::$data['lastPage'];?> </div>
<?php
namespace grace\controller;
use grace\grace;
use grace\database;
class index extends grace{
public function index(){
// 利用 $_GET['page'] 传递页码
$_GET['page'] = empty($_GET['page']) ? 1 : $_GET['page'];
// 使用 $this-> 将对象和数据注册为控制器数据 共享给视图
$this->studentsTable = database::table('students');
// 利用 $_GET['total'] 保存总数，
// 第一次查询或者 url 没有保存总数则查询数据总数
if(empty($_GET['total'])){
$_GET['total'] = $this->studentsTable->count();
}
$this->students = $this->studentsTable
->order('st_id desc')
->page($_GET['page'], $_GET['total'], 2, 10, 'a')
->fetchAll();
}
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
</head>
<body>
<div style="padding:100px;">
<ul>
<?php foreach($this->students[0] as $student){?>
<li>id : <?php echo $student['st_id'];?> 姓名 : <?php echo $student['st_name'];?> 年龄 : <?php echo $student['st_age'];?></li>
<?php }?>
</ul>
<!-- 分页部件 -->
<?php $this->__widget('paging', $this->students[1]);?>
</div>
<style>
li{list-style:none;}
.pager-list{margin-top:15px;}
.pager-list .pager{display:block; font-size:14px; color:#333333; background:#F5F5F5; padding:0px 10px; height:30px; line-height:30px; float:left; margin-right:5px; border-radius:2px; cursor:pointer; text-decoration:none;}
.pager-list .pager:hover{background:#2F4056; text-decoration:none; color:#FFFFFF !important;}
.pager-list .pager:visited{color:#333333;}
.pager-list .current{background:#5FB878 !important; color:#FFF !important;}
</style>
</body>
</html>