来了老弟,Layui树形菜单的参数与数据源属性

   上一期小编分享了layui树形,但是还缺少可自定义的东西。

   那么这期就给大家分享一下基础参数,让大家可以自定义自己的树形。

   搬砖使小编快乐,小编在快乐的搬砖

基础参数

参数选项

说明

类型

示例值

elem

指向容器选择器

String/Object

elem: '#test1'

data

数据源

Array

详见后面的数据选项

id

设定实例唯一索引,用于基础方法传参使用。

String

请看第一个

showCheckbox

是否显示复选框

Boolean

false

 

 

edit

是否开启节点的操作图标。默认 false

  • 若为 true,则默认显示改删图标
  • 若为 数组,则可自由配置操作图标的显示状态和顺序,目前支持的操作图标有:addupdatedel,如: 

    edit: ['add', 'update', 'del']

 

 

Boolean/Array

 

 

['update', 'del']

accordion

是否开启手风琴模式,默认 false

Boolean

false

 

onlyIconControl

是否仅允许节点左侧图标控制展开收缩。默认 false(即点击节点本身也可控制)。若为 true,则只能通过节点左侧图标来展开收缩

 

Boolean

 

false

 

isJump

是否允许点击节点时弹出新窗口跳转。默认 false,若开启,需在节点数据中设定 link 参数(值为 url 格式)

 

Boolean

 

false

showLine

是否开启连接线。默认 true,若设为 false,则节点左侧出现三角图标。

Boolean

true

 

text

自定义各类默认文本,目前支持以下设定:

  1. text: {
  2. defaultNodeName: '未命名' //节点默认名称
  3. ,none: '无数据' //数据为空时的提示文本
  4. }

 

Object

 

小编也还没用到


然后的话就是数据源属性选项了

 

数据源属性选项

属性选项

说明

类型

示例值

title

节点标题

String

未命名

id

节点唯一索引,用于对指定节点进行各类操作

String/Number

任意唯一的字符或数字

children

子节点。支持设定选项同父节点

Array

[{title: '子节点1', id: '111'}]

href

点击节点弹出新窗口对应的 url。需开启 isJump 参数

String

任意 URL

spread

节点是否初始展开,默认 false

Boolean

true

checked

节点是否初始为选中状态(如果开启复选框的话),默认 false

Boolean

true

disabled

节点是否为禁用状态。默认 false

Boolean

false

 

参数与属性基本就是这么多,例子呢小编上一期也有分享。

 

两篇一起结合看喔,然后自己定义出属于自己的风格的树形!

 

本期完

你可能感兴趣的:(js)