php layui流加载,thinkPHP+LayUI 流加载功能如何实现

thinkPHP+LayUI 流加载功能如何实现？这篇文章主要介绍了thinkPHP+LayUI流加载实现功能,本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，感兴趣的玩家快来一聚教程网参考一下吧！

html

js，要引入layui.js

layui.use('flow', function() {

var $ = layui.jquery;

var flow = layui.flow;

flow.load({

elem: '#container' //流加载容器

//滚动条所在元素，一般不用填，此处只是演示需要。

,done: function(page, next){ //执行下一页的回调

console.log(page)

//模拟数据插入

setTimeout(function(){

var lis = [];

var url = "/index/index/ajaxNews/?page="+page

$.get(url,function (res) {

layui.each(res.msg.data, function(index, item) {

lis.push('\

\

\\

\

\

'+item.title+'\

'+item.intro+'\

\

\

\

');

});//组装html

//pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多

next(lis.join(''), page <= res.msg.pages);

})

}, 300);

}

});

});

php Controller控制器

public function ajaxNews()

{

$page = input('page'); //页码

$pagesize = 6;

$list['data'] = model('Index')->getNewsList($page,$pagesize);

$count= model('Index')->getNewsCount();

$list['pages'] = ceil($count/$pagesize);

if ($list) {

return return_succ($list);

}else{

return return_error('暂无数据');

}

}

php model模型

// 获取动态列表

public function getNewsList($page,$pagesize)

{

$list = Db::name('news')

->field('id,title,intro,cover_img')

->order('create_time desc')

->where(['status'=>0])

->page($page,$pagesize)

->select();

return $list;

}

//获取动态总条数

public function getNewsCount()

{

$count = Db::name('news')->where(['status'=>0])->count();

return $count;

}