点击父节点，获取该节点的id，然后渲染成子节点
需求是：异步获取父节点，点击父节点，根据父节点的lable，异步获取子节点
官网的解析是这样的
贴代码
data里面props定义，我的标签lable设置为index，异步过程就是获取index数据
props: {
label:'index',
children: [],
isLeaf:false
}
js部分
handleNodeClick(data) {
if (!data.isLeaf) {
console.log('resolve select data')
this.searchForm.yearid = data.year
this.searchForm.monthid = data.monthid
this.search()
}
},
loadNode(node, resolve){
if (node.level ===0) {
this.getyearList(resolve)
}
if (node.level >=1) {
this.getmouthByYear(node.data.yearid,resolve)
}
},
获取getyearList 就是父节点数据，getmouthByYear就是异步获取子节点数据
getyearList (resolve) {
let url ='zipfile/yearlist'
this.axios.get(url)
.then(res => {
if (res.data.code ===200) {
let data = res.data.data
if (data.length ===0) {
this.$message({
message:'请先上传zip文件',
type:'error'
})
return false
}
data.forEach(item => {
item.index = item.yearid
item.isLeaf =true
})
resolve(data)
}else {
this.$message({
message: res.data.msg,
type:'error'
})
return false
}
})
.catch(err => {
console.log(err)
})
}
resolve里面就是需返回props的数据，因为我props里面的lable标签设置为index，所以我将返回的数据yearid赋值给index，并将data父节点isLeaf置为true。
获取子节点数据请求
getmouthByYear (yearid,resolve) {
let url ='zipfile/monthlist'
this.axios.post(url, {yearid:yearid}).then(res => {
if (res.data.code ===200) {
let data = res.data.data
data.forEach(item => {
if (item.monthid) {
item.year = yearid
item.index = item.monthid
item.isLeaf =false
}
})
resolve(data)
}else {
this.$message({
message: res.data.msg,
type:'error'
})
return false
}
}).catch(err => {
console.log(err)
})
}
最终实现效果：点击父节点，获取子节点，点击子节点，根据父节点和子节点的参数，获取对应table数据
