本地dede网站怎么上线,北京建站工具,酒店网页设计素材,紫金网站建设价格新增默认选中1. _checked字段增加2. 给data项设置特殊 key _checked: true2.0 多选框样式错乱#xff0c;默认选中问题1. 修改为元素checkbox 样式大概调整2. 如果样式不好看 可以自行修改或者使用其他组件ui checkboxAPI
props
属性说明类型items显示的结构化数据Arraycolumn…新增默认选中1. _checked字段增加2. 给data项设置特殊 key _checked: true2.0 多选框样式错乱默认选中问题1. 修改为元素checkbox 样式大概调整2. 如果样式不好看 可以自行修改或者使用其他组件ui checkboxAPI
props
属性说明类型items显示的结构化数据Arraycolumns表格列的配置描述Array
columns
属性说明类型默认值title列头显示文字String#key对应列内容的字段名String#width列宽名Number#sortable排序功能Booleanfalsetypeselection:多选功能String#typeaction 操作功能, 必填参数:actions:[{}]String#
events
事件名说明返回值on-row-click单击行或者单击操作按钮方法data,$event,indexon-selection-change返回选中数组arron-sort-change表格列的配置描述key和排序规则(值为 asc 或 desc)
使用方式
templatetree-grid :itemsdata :columnscolumnson-row-clickrowClickon-selection-changeselectionClickon-sort-changesortClick/tree-grid
/template
scriptimport TreeGrid from ./components/TreeGridexport default {data() {return {columns: [{type: selection,width: 50,}, {title: 编码,key: code,sortable: true,width: 150,}, {title: 名称,key: name,width: 150,}, {title: 状态,key: status,width: 150,}, {title: 备注,key: remark,width: 150,}, {title: 操作,type: action,actions: [{type: primary,text: 编辑}, {type: error,text: 删除}],width: 150,}],data: [{id: 1,code: 0001,name: 测试数据1,status: 启用,remark: 测试数据测试数据,_checked: true}, {id: 2,code: 0002,name: 测试数据2,status: 启用,remark: 测试数据测试数据,children: [{id: 01,code: 00001,name: 测试数据01,status: 启用,remark: 测试数据测试数据,}, {id: 02,code: 00002,name: 测试数据02,status: 启用,remark: 测试数据测试数据,}]}, {id: 3,code: 0003,name: 测试数据3,status: 启用,remark: 测试数据测试数据}, {id: 4,code: 0004,name: 测试数据4,status: 启用,remark: 测试数据测试数据}]}},components: {TreeGrid},methods: {rowClick(data, index, event) {console.log(当前行数据: data)console.log(点击行号: index)console.log(点击事件: event)},selectionClick(arr) {console.log(选中数据id数组: arr)},sortClick(key, type) {console.log(排序字段: key)console.log(排序规则: type)}}}
/script