## [PHP交流群：494826865（点击群号立即加群）](https://jq.qq.com/?_wv=1027&k=50Qy5h6)
# 前台数据调用
**首页课程列表显示**
后台代码的编写：后台代码分层处理（控制器层-逻辑层-Dao层）
控制器层（在前台首页对应的控制器及方法中获取推荐课程数据并分配到视图）
Home/IndexController.php
~~~
/**
* Get data list. access uri path: /index
* @RequestMapping(route="/", method=RequestMethod::GET)
* @return \Swoft\Http\Message\Response
* @throws \Throwable
*/
public function index()
{
//获取最新推荐课程
$data = BeanFactory::getBean(CourseLogic::class)->getNewsCourse(8);
return view("home/index",['list'=>$data]);
}
~~~
逻辑层（不直接操作实体）
Model/Logic/CourseLogic.php
~~~
/**
* Get data list. access uri path: /index
* @RequestMapping(route="/", method=RequestMethod::GET)
* @return \Swoft\Http\Message\Response
* @throws \Throwable
*/
public function index()
{
//获取最新推荐课程
$data = BeanFactory::getBean(CourseLogic::class)->getNewsCourse(8);
return view("home/index",['list'=>$data]);
}
~~~
Dao层（直接操作实体）
Model/Dao/CourseDao.php
~~~
//获取最新推荐课程
public function getNewsCourse($num){
$data = Course::where("isshow",1)->orderByDesc("created_at")->take($num)->get();
return $data;
}
~~~
到这里数据就可以分配到`home/index.php`视图
将推荐课程通过循环在视图中显示
~~~
<?foreach ($list as $l):?>
<!-- start list -->
<div class="col-6 col-sm-6 col-md-4 col-lg-3 mb-4 item">
<div class="box">
<div class="img"><img src="<?=$l['pic']?>" class="img-fluid" alt="" srcset=""></div>
<div class="mt-2 title"><?=$l['title']?></div>
<div class="desc">
<?=$l['digest']?>
</div>
</div>
</div>
<!-- end list -->
<?endforeach?>
~~~
**列表页数据显示**
> 这一部分重点是，数据分页！
>
> 数据分页的实现分两部分，第一部分是后端的数据分页的实现，第二部分是前台的数据分页的实现。后端主要是指数据的分页查询，前端主要是指分页航的实现。后台的处理比较简单，一般的框架都提供的有便捷的查询方法。在swoft中可以使用`forpage`来实现。
>
> 前端的分页导航的实现有多种方式，在这里使用异常分页的方式来实现，这种方式与传统的分页形式像比，体验较好，但是不利于SEO优化。在选择使用时，要根据自己的实际需求来定。
异步分页接口的实现
> 异步分页接口的核心，是返回JSON的数据格式，并且在前端要能够获取到总页数。
控制器层中添加分页数据接口
Home/ListController.php
~~~
/**
* @RequestMapping("/api/getcourses")
* @param Request $request
* @return \Swoft\Http\Message\Response
* @throws HttpExecption
*/
public function getdata(Request $request){
if(!$request->isAjax()){
throw new HttpExecption("请求异常");
}
$parms = $request->get();
$data = BeanFactory::getBean(CourseLogic::class)->getDatas($parms);
return context()->getResponse()->withData($data);
}
~~~
> 在这里逻辑层和Dao与后台的课程分页功能共用。
列表视图中分页数据的展示：
> 在这主要是通过JS来实现
~~~
<script>
function createItem(pic='',title='',desc=''){
//这里用到了Es6语方法，如果出现浏览器兼容性部题，请改成字符串拼接方式即可。
return `<div class="col-6 col-sm-6 col-md-4 col-lg-3 mb-4 item">
<div class="box">
<div class="img"><img src="${pic}" class="img-fluid" alt="" srcset=""></div>
<div class="mt-2 title">${title}</div>
<div class="desc">
${desc}
</div>
</div>
</div>`;
}
var page =0;
var limit =10;
var count =5;
req(++page,limit);
$("#loaddata").on('click',function(){
if(page > count-1){
alert("没有数据了");
return;
}
req(++page,limit);
});
function req(page,limit){
$.ajax({
url:'/api/getcourses',
type:'get',
data:{page:page,limit:limit},
success:function(res){
if(page==1){
count = Math.ceil(res.count/limit);
}
for(var i=0;res.data.length;i++){
str = createItem(res.data[i].pic,res.data[i].title,res.data[i].desc);
$(".items").append(str);
}
}
})
}
</script>
~~~
页面中公共数据的获取
> 在页面的展示过程中，有些数据，可能是共用的，在这里前端视图用到了模板包含所以，并且主视图与子视图的变量是不共用的，所以在调用时，需要单独进行传递。在这里咱们换种思路来实现，就是通过自定义函数来解决这个问题。
>
> 在这里以站点配置信息为例来介绍。由于配置信息每个页面都会用的到，所以配置信息单独定义一个自定义函数来实现。
在helper/functions.php中定义函数`get_config`用来根据字段名来 获取对应的配置信息
~~~
/**
* 通过Key获取配置信息
* @param $key
* @return string
*/
function get_config($key){
$config = bean(\App\Model\Logic\ConfigLogic::class)->getData();
return $config[$key]??"";
}
~~~
在视图可以通过如下方式调用：
~~~
<?=get_config("webtitle")?>
~~~
- 前言
- 第一部分：课程介绍
- 第二部分：docker的快速入门
- docker的安装
- docker的运行和配置
- docker操作过程中的常见问题
- Docker的常用命令
- 第三部分 Swoft的开发环境部署和工具的安装
- 第四部分：Swoft的安装和常见问题
- swoft的安装
- swoft代码同步
- Swoft的热重载
- swoft安装过程中的常见问题
- 第五部分：swoft的基础知识快速入门
- 目录结构
- 控制器
- 路由
- 配置
- 请求与响应
- 中间件
- 异常处理
- 视图
- Bean
- 数据库操作
- http-session
- 验证器
- 第六部分：实战
- Swoft的安装（本地）
- Swoft的环境部署
- 调整项目目录结构
- 前台页面部署
- 前台首页
- 引入前端资源
- 其它页面的引入
- 后台功能的实现
- 创建并连接数据库
- 管理员登录功能的实现
- 代码优化-函数
- 代码优化-全局异常处理
- 代码结构分层
- 完善管理员的登录功能
- 管理员密码修改功能的实现
- 管理员登录补充
- 站点配置功能的实现
- 后台菜单处理
- 课程管理功能
- 创建数据表并创建实体
- 实现课程的添加功能
- 文件上传
- 课程列表功能的实现
- 课程编辑功能的实现
- 课程的删除功能
- 课程推荐功能的实现
- 前台数据调用