Element+vud.js 树形数据与懒加载
用的是element的table控件,table里面展示多级树.
示例:
<el-table
:data="tableData1"
style="width: 100%"
row-key="id"
border
lazy
:load="load"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column
prop="date"
label="日期"
width="180">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column>
<el-table-column
prop="address"
label="地址">
</el-table-column>
</el-table>
lazy属性,定义数据为懒加载模式.点击未加载的节点,触发load.请求后台数据.加载这个树节点的下层数据.
需求:有多级树,需要个1键展开功能,直接展开当前层所有未展开的节点.
难点:系统自带的
load(tree, treeNode, resolve) {
setTimeout(() => {
resolve([
{
id: 31,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
id: 32,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}
])
}, 1000)
}
有树和节点.但是如果1键展开,系统返回的多个数据怎么挂载到相应的树节点下面.