当前位置: 代码迷 >> 综合 >> PHP+LayUI 流加载详细用法跨坑记录。
  详细解决方案

PHP+LayUI 流加载详细用法跨坑记录。

热度:56   发布时间:2023-10-17 21:36:59.0

这里是html:

<div><ul id="demo">//组装的html将会出现在这里。</ul>
</div>

这里是layui的javascript: 

//记得先引用layui.js
//<script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
//<link rel="stylesheet" href="/static/plugins/layui/css/layui.css" media="all" />layui.use('flow', function() {var $ = layui.jquery;var flow = layui.flow;flow.load({elem: '#demo',//要插入数据的元素的iddone: function(page, next) {//page从1开始,var lis = [];$.get('/home/myvip/data?page=' + page, function(res) {//接口地址layui.each(res.data, function(index, item) {lis.push('<li>\<a href="javascript:;">\<div>\<img src="'+item.avatar+'" />\<h3><p>'+item.username+'</p><span>'+item.level_name+'</span></h3>\<p>关注时间:'+item.reg_time+'</p>\</div>\<h4>+'+item.sum+'<br />'+item.member+'个成员</h4>\</a>\</li>');});//组装htmlnext(lis.join(''), page < res.pages);//res.pages是统计,把所有你要显示的数据统计传过来。 });}});

 这里是PHP:

public function data($page,$pagesize=10){$list = db('users')->alias('u')->join('user_level ul','u.level=ul.level_id','left')->field('u.username,u.reg_time,ul.level_name,u.id,u.parentid,u.avatar')->where('parentid',$this->userid)->order('id desc')->page($page,$pagesize)//这个是关键的分页助手函数。//可以查看文档了解。第一个参数是页码,第二个参数是 每页数量->select();foreach ($list as $k => $v) {$list[$k]['member']=db('users')->where('parentid',$v['id'])->count();$list[$k]['sum']=db('commission')->where('sonid',$v['id'])->where('userid',$this->userid)->sum('yongjin');$list[$k]['reg_time']= date('Y-m-d',$v['reg_time']);if ($v['avatar'] == '') {$list[$k]['avatar'] = '/static/home/images/touxiang.png';}}$res['pages'] = db('users')->alias('u')->join('user_level ul','u.level=ul.level_id','left')->field('u.username,u.reg_time,ul.level_name,u.id,u.parentid,u.avatar')->where('parentid',$this->userid)->order('id desc')->count();//统计总数,这里还可以优化一下,但是我懒$res['data']  = $list;//返回列表return $res;}

以上。

  相关解决方案