这篇文章主要介绍了thinkPHP+LayUI 流加载实现功能,本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下。

html

<div class="layui-container" id="container"> </div>

js，要引入layui.js

1. layui.use('flow', function() { 
2.   var $ = layui.jquery; 
3.   var flow = layui.flow; 
4.     flow.load({ 
5.     elem: '#container' //流加载容器 
6.       //滚动条所在元素，一般不用填，此处只是演示需要。 
7.     ,done: function(page, next){ //执行下一页的回调 
8.      console.log(page) 
9.      //模拟数据插入 
10.      setTimeout(function(){ 
11.       var lis = []; 
12.       var url = "/index/index/ajaxNews/?page="+page 
13.       $.get(url,function (res) { 
14.           
15.           layui.each(res.msg.data, function(index, item) { 
16.             lis.push('<div class="layui-row list">\ 
17.               <a href="newsDesc/id/'+item.id+'" rel="external nofollow" >\ 
18.                 <div class="layui-col-xs4 layui-col-sm4 ">\ 
19.                   <img src="'+item.cover_img+'">\ 
20.                 </div>\ 
21.                 <div class="layui-col-xs7 layui-col-sm7 right">\ 
22.                   <div class="title">'+item.title+'</div>\ 
23.                   <div class="intro">'+item.intro+'</div>\ 
24.                 </div>\ 
25.               </a>\ 
26.             </div>\ 
27.             <hr/> '); 
28.           });//组装html 
29.           //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多 
30.           next(lis.join(''), page <= res.msg.pages); 
31.           
32.       }) 
33.      }, 300); 
34.     } 
35.    }); 
36. }); 
37. </script> 

php Controller控制器

1. public function ajaxNews() 
2.   { 
3.     $page = input('page');  //页码 
4.     $pagesize = 6; 
5.     $list['data'] = model('Index')->getNewsList($page,$pagesize); 
6.     $count= model('Index')->getNewsCount(); 
7.     $list['pages'] = ceil($count/$pagesize); 
8.     if ($list) { 
9.       return return_succ($list); 
10.     }else{ 
11.     return return_error('暂无数据'); 
12.     } 
13.   } 

php model模型

1. // 获取动态列表 
2.   public function getNewsList($page,$pagesize) 
3.   { 
4.     $list = Db::name('news') 
5.       ->field('id,title,intro,cover_img') 
6.       ->order('create_time desc') 
7.       ->where(['status'=>0]) 
8.       ->page($page,$pagesize) 
9.       ->select(); 
10.     return $list; 
11.   } 
12.   //获取动态总条数 
13.   public function getNewsCount() 
14.   { 
15.     $count = Db::name('news')->where(['status'=>0])->count(); 
16.     return $count; 
17.   }

Tags: thinkPHP流加载 LayUI流加载

分享到：