场景:最近做tree异步加载的功能,但是发现只有我第一次点击的时候,会调用方法加载,后面再点击都不会再加载。
需求:每次点击都会加载
解决方法:
用onExpand,onLoad,loadedKeys,expandedKeys
<Tree
showIcon
blockNode
loadData={this.onLoadData}
onLoad={this.onLoad} // 节点加载完毕时触发
onSelect={this.onSelectTree}
selectedKeys={selectedKeys}
onExpand={this.onExpand} // 展开/收起节点时触发
expandedKeys={expandedKeys} // 已经展开的节点
loadedKeys={loadedKeys} // 已经加载的节点
>
{this.renderTreeNodes(dataSource)}
</Tree>
// 展开/收起节点时触发
private onExpand = (keys) => {
const { loadedKeys, expandedKeys } = this.state
let newLoadKeys = loadedKeys
// 判断当前是展开还是收起节点,当前展开的长度比之前的少,说明是收起。
if (expandedKeys.length > keys.length) {
// 当是收起的时候,把这个收起的节点从loadedKeys中移除
newLoadKeys =