Layui 自定义图标

1、html

 <div class="layui-input-block" style="width: 230px ;margin-left: 4px">
       <input value="${item.icon!}" type="text" id="iconPicker" lay-filter="iconPicker" class="hide" lay-verify='required' >
　　　　<input id="icon" name="icon" class="layui-input" value="${item.icon!}">
 </div>    

2、js

//layui引入 iconPicker
layui.use(['iconPicker'], function (){

　　var iconPicker = layui.iconPicker;

　　iconPicker.render({
        // 选择器，推荐使用input
        elem: '#iconPicker', // 数据类型：fontClass/unicode，推荐使用fontClass type: 'fontClass', // 是否开启搜索：true/false，默认true search: true, // 是否开启分页：true/false，默认true page: true, // 每页显示数量，默认12 limit: 12, // 点击回调 click: function (data) { $("#icon").val(data.icon); }, // 渲染成功后的回调 success: function(d) { } });

 $(function() {
     //初始化展示
     let icon = $("#icon").val();
     iconPicker.checkIcon('iconPicker', icon);

});

}) 

实现效果