新增 dropdown 的 `customName` 属性,用于自定义 `data` 属性中常用的字段名称

pull/1321/head
贤心 1 year ago
parent 37fd63d2ec
commit 365ac5af17

@ -19,7 +19,13 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
// 外部接口 // 外部接口
var dropdown = { var dropdown = {
config: {}, config: {
customName: { // 自定义 data 字段名
id: 'id',
title: 'title',
children: 'child'
}
},
index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0, index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0,
// 设置全局项 // 设置全局项
@ -140,6 +146,9 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
elem.attr('id') || that.index elem.attr('id') || that.index
); );
// 初始化自定义字段名
options.customName = $.extend({}, dropdown.config.customName, options.customName);
if(options.show || (type === 'reloadData' && that.elemView && $('body').find(that.elemView.get(0)).length)) that.render(rerender, type); //初始即显示或者面板弹出之后执行了刷新数据 if(options.show || (type === 'reloadData' && that.elemView && $('body').find(that.elemView.get(0)).length)) that.render(rerender, type); //初始即显示或者面板弹出之后执行了刷新数据
that.events(); // 事件 that.events(); // 事件
}; };
@ -148,6 +157,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
Class.prototype.render = function(rerender, type){ Class.prototype.render = function(rerender, type){
var that = this; var that = this;
var options = that.config; var options = that.config;
var customName = options.customName;
var elemBody = $('body'); var elemBody = $('body');
// 默认菜单内容 // 默认菜单内容
@ -164,9 +174,10 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
// 遍历菜单项 // 遍历菜单项
var eachItemView = function(views, data){ var eachItemView = function(views, data){
// var views = []; // var views = [];
layui.each(data, function(index, item){ layui.each(data, function(index, item){
// 是否存在子级 // 是否存在子级
var isChild = item.child && item.child.length > 0; var isChild = item[customName.children] && item[customName.children].length > 0;
var isSpreadItem = ('isSpreadItem' in item) ? item.isSpreadItem : options.isSpreadItem var isSpreadItem = ('isSpreadItem' in item) ? item.isSpreadItem : options.isSpreadItem
var title = function(title){ var title = function(title){
var templet = item.templet || options.templet; var templet = item.templet || options.templet;
@ -176,7 +187,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
: laytpl(templet).render(item); : laytpl(templet).render(item);
} }
return title; return title;
}(util.escape(item.title)); }(util.escape(item[customName.title]));
// 初始类型 // 初始类型
var type = function(){ var type = function(){
@ -193,7 +204,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
return ''; return '';
}(); }();
if(type !== '-' && (!item.title && !item.id && !isChild)) return; if(type !== '-' && (!item[customName.title] && !item[customName.id] && !isChild)) return;
//列表元素 //列表元素
var viewLi = $(['<li'+ function(){ var viewLi = $(['<li'+ function(){
@ -240,14 +251,14 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
//子级区 //子级区
if(isChild){ if(isChild){
var elemPanel = $('<div class="layui-panel layui-menu-body-panel"></div>') var elemPanel = $('<div class="layui-panel layui-menu-body-panel"></div>');
,elemUl = $('<ul></ul>'); var elemUl = $('<ul></ul>');
if(type === 'parent'){ if(type === 'parent'){
elemPanel.append(eachItemView(elemUl, item.child)); elemPanel.append(eachItemView(elemUl, item[customName.children]));
viewLi.append(elemPanel); viewLi.append(elemPanel);
} else { } else {
viewLi.append(eachItemView(elemUl, item.child)); viewLi.append(eachItemView(elemUl, item[customName.children]));
} }
} }
@ -314,7 +325,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
that.elemView.find('.layui-menu li').on('click', function(e){ that.elemView.find('.layui-menu li').on('click', function(e){
var othis = $(this); var othis = $(this);
var data = othis.data('item') || {}; var data = othis.data('item') || {};
var isChild = data.child && data.child.length > 0; var isChild = data[customName.children] && data[customName.children].length > 0;
var isClickAllScope = options.clickScope === 'all'; // 是否所有父子菜单均触发点击事件 var isClickAllScope = options.clickScope === 'all'; // 是否所有父子菜单均触发点击事件
if(data.disabled) return; // 菜单项禁用状态 if(data.disabled) return; // 菜单项禁用状态

Loading…
Cancel
Save