在 ExtJS+SpringBoot实现读取后端数据的树 中介绍了如何获取后端数据进行书的显示。 通过设置节点的expanded 为true 会自动调用后端接口并展出下一级, 但是在实际开发中发现: 如果树的数据量较大, 展开的层级大于1级, 则会出现第二层节点无法展出的状况, 通过Chrome 的控制台可以看到如下错误:
Util.js?_dc=1665383584923:973 [E] Error while running task - TypeError: Cannot read property 'insertBefore' of null
Caller: function() {
从错误信息来看, 是在插入节点时出错,看上去的原因是上一层的节点还没有渲染好就进行插入,导致null 的错误。 稍微追踪了一下, 树的节点的展开操作是异步执行的,所以在多层展开节点的时候, 如果上一层没有渲染好,而下一层有开始展出的时候就恨又可能出现整个问题了。
解决的思路就是后端返回的数据的节点的expanded 全部设置为false,也就不自动展出, 而是在前端手动调用对应的方法进行节点的展开。具体解决方案如下:
所有后端都不设置自动展开,提供一个接口返回需要展开的多级节点的i