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"
}
