Layui 手册

icon-图标

1：√
2：×
3：问号
4：锁
5：哭脸
6：笑脸
7：感叹号

使用layer.msg('提示',{icon:1});  目前只有7种图标可选，用的适当还是很好看的。 

表格刷新

parent.layui.table.reload('表格的ID', { page: { curr: 1 } });

这种是弹出层页面刷新父窗体表格数据的惯用手法，但我把这种重载写成一个方法，父页面还是可以正常调用。如果在子窗体调用父窗体的这个方法则会出错。方法和layui.use在同一个script标签下，方法会失效，只能写在另一个script标签里面。

在IE浏览器中进行数据添加后，数据未能正确重载。这是因为IE浏览器在执行请求时，如果url请求参数一致，会默认调用缓存，这样你的数据依旧是初次加载的数据。

解决措施：在表格重载的条件中加一个时间参数，让它认为这是一个新请求就行了，就不会调用缓存。

where: { time:new Date()｝

数据查询

在对表格进行查询等操作时，如果表格使用的是自动渲染，同时页面中有文本框查询，下拉框查询，这样进行查询时。如果你上一次使用了下拉框中的条件做了查询，当你再使用文本框进行查询时，下拉框的参数还是会携带上一次的值，导致查询结果异常。使用方法级渲染可避免此类问题，二者重载的方式存在差异。当然，有时候为了更方便的自定义表头，使用了自动渲染且条件参数相对较少，你可以考虑进行查询时给其他参数赋空值。

定位当前页

场景：在操作表格中，对第二页数据进行了修改操作，当你重载表格时，页码会自动跳到第一页，如何修改完成后，就停留在当前页呢？

$(".layui-laypage-btn")[0].click(); 

这是模拟分页的那个确定按钮，我遇到这个问题，在Layui社区搜到的答案。具体请见

https://fly.layui.com/jie/13973/

文件上传获取文件名

在官方的文档选择文件的回调中有这么一串代码，只是我并没有理解，所以不知道怎么获取，后来才知晓file参数所代表的含义。

,choose: function(obj){

//将每次选择的文件追加到文件队列

var files = obj.pushFile();

//预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)

obj.preview(function(index, file, result){

console.log(index); //得到文件索引

console.log(file); //得到文件对象  这里已经说了得到了文件对象，那就可以直接file.name直接获取文件名

console.log(result); //得到文件base64编码，比如图片

//obj.resetFile(index, file, '123.jpg'); //重命名文件名，layui 2.3.0 开始新增

表格显示图片

有时候为了丰富表格内容，会对一些内容进行特别的样式编排，比如对某项内容使用a标签跳转，使用表单元素如checkbox来展示状态，这些都可以用templet模版来实现。那如何显示图片呢，下面就来说说实现方式，官方文档给出了三种templet语法方式，这里所使用的的是函数转义的方式。

templet:function (d) { return '<div><img src='+d.PrizeImg+'></div>' }

官方栗子：

table.render({
  cols: [[
    {field:'title', title: '文章标题', width: 200
      ,templet: function(d){
        return 'ID：'+ d.id +'，标题：<span style="color: #c00;">'+ d.title +'</span>'
      }
    }
    ,{field:'id', title:'ID', width:100}
  ]]
}); 

但存在缺点，对于图片的大小控制很难操控，可能是因为表格的单元格样式，我很想显示成一个略缩图的样子，但是没有实现，只是大致设了大小，显示一块内容内容，看起来是真的丑。😄

表单元素渲染问题

我想实现一个复选框反选的功能，语法没问题，但最后就是没效果，后来才知道运用它的表单元素，得重新渲染才行。　　form.render(); //更新全部

此外，如果表单用了样式，复选框的点击事件会失效，原因可能是上了一个皮肤，可能已经不认识它了，你如果不想用既定的样式，可以在元素样式中加上lay-ignore，这样就是原生的了。

日期插件

当一个页面想调用两个日期插件时，网上大佬已经给了答案，经测试可以使用。

同时，trigger: 'click'  也是解决时间插件闪屏的方法。

<script>
    function useLayDateMultiple(cls) {
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            lay('#' + cls).each(function () {
                laydate.render({
                    elem: this,
                    type: 'datetime',
                    trigger: 'click'
                });
            });
        });
    }
    useLayDateMultiple('第一个元素ID');
    useLayDateMultiple('第二个元素ID');
</script>