layuimini 图标颜色便捷指定
layuimini 后台图片默认都是没有颜色。为了美观做了修改,可以在菜单初始化的时候就渲染好图标的颜色
第一步 修改miniMenu.js文件
一:
renderLeftMenu :function(leftMenus,options){ options = options || { }; var me = this ; var leftMenusHtml = me.each(leftMenus || [],function (idx,leftMenu) { // 左侧菜单遍历 var children = me.renderChildrenMenu(leftMenu.child, { childOpenClass:options.childOpenClass }); var leftMenuHtml = me.compileMenu({ href: leftMenu.href, target: leftMenu.target, childOpenClass: options.childOpenClass, icon: leftMenu.icon, title: leftMenu.title, children: children, className: , //增加该行代码 iconColor:leftMenu.icon.split(" ").length>=3?leftMenu.icon.split(" ")[2]: }); return leftMenuHtml ; }).join(""); leftMenusHtml = me.compileMenuContainer({ id:options.parentMenuId,className:options.leftMenuCheckDefault,children:leftMenusHtml }) ; return leftMenusHtml ; },
二:修改compileMenu函数 将i标签模板修改成如下形式
<i class="{ {d.icon}}" { { #if(d.iconColor){ }} style="color: { {d.iconColor}}"{ { #}}}></i>
使用:
在添加菜单的时候 在icon字段内容 最后面添加指定颜色即可。
{ "title": "错误日志", "icon": "fa fa-file-text-o red", "href": "", "target": "_blank" }