mirror of
https://gitee.com/ant-design-vue/ant-design-vue.git
synced 2024-12-04 04:58:16 +08:00
1.0 KiB
1.0 KiB
#### 异步数据加载
点击展开节点,动态加载数据。
#### load data asynchronously
To load data asynchronously when click to expand a treeNode.
<template>
<a-tree
:loadData="onLoadData"
:treeData="treeData"
/>
</template>
<script>
export default {
data () {
return {
treeData: [
{ title: 'Expand to load', key: '0' },
{ title: 'Expand to load', key: '1' },
{ title: 'Tree Node', key: '2', isLeaf: true },
],
}
},
methods: {
onLoadData (treeNode) {
return new Promise((resolve) => {
if (treeNode.dataRef.children) {
resolve()
return
}
setTimeout(() => {
treeNode.dataRef.children = [
{ title: 'Child Node', key: `${treeNode.eventKey}-0` },
{ title: 'Child Node', key: `${treeNode.eventKey}-1` },
]
this.treeData = [...this.treeData]
resolve()
}, 1000)
})
},
},
}
</script>