layui结合jfinal增删改查——列表显示-白红宇

layui结合jfinal增删改查——列表显示

阅读量：6855 次

发布时间：2019-06-26

本文共 1786 字，大约阅读时间需要 5 分钟。

1、列表显示

（1）在后台获取json数据，然后绑定到列表，如下所示：


    
                                           ID              用户名              邮箱              手机号              地址              性别              角色

< script type = "text/html" id = "userBar" >      查看 <  / a >      编辑 <  / a >      删除 <  / a >          < script >    layui.use('table', function ()    {        var table = layui.table;    });

这样就完成了基本的列表数据绑定，效果如下：

输入图片说明

（2）列表数据返回格式，注意格式要求，需要在现有接口数据基础上进行调整，格式如下：

{"code":0 状态，0表示成功,"msg":"" 提示，一般非0时会显示在table中间区,"count":1000 记录总数,"data":[{"id":10000,"username":"user-0","sex":"女","city":"城市-0","sign":"签名-0","experience":255,"logins":24,"wealth":82830700,"classify":"作家","score":57},...}}

data起头就是具体的数据了。code msg count data 这些，你可以根据你后台接口进行调整，比如code改成result，在table中定义一下对照就行。

（3）所以在后台，我建了个Page类，以便规范返回格式。

// 数据列表	private List
    
      data;	private int code;	private String msg;	private int count;		public List
     
       getData() {		return data;	}	public void setData(List
      
        data) {		this.data = data;	}	public int getCode() {		return code;	}	public void setCode(int code) {		this.code = code;	}	public String getMsg() {		return msg;	}	public void setMsg(String msg) {		this.msg = msg;	}	public int getCount() {		return count;	}	public void setCount(int count) {		this.count = count;	}	public static long getSerialversionuid() {		return serialVersionUID;	}	private static final long serialVersionUID = -7180359178518841827L;}

（4）jfinal返回列表json数据：

public void userJson(){		List
    
      userList = userService.getUserList();		Page
     
       page = new Page
      
       ();		page.setCode(0);		page.setCount(1000);		page.setMsg("");		page.setData(userList);		renderJson(page);	}