重庆熊猫 Loading

ExtJS 7 的Tab Reorder 插件持续更新布局问题解决办法 (Solution to layout issues in the continually updated Tab Reorder plugin of ExtJS 7)

更新记录
2023年4月13日 初始化。

ExtJS教程汇总:https://www.cnblogs.com/cqpanda/p/16328016.html

鉴于ExtJS官方已经躺平(给他们发邮件他们只回复个谢谢),只有自己改源码了。需要的老哥自己照着改一下源码就行了。

转载请注明出处:重庆熊猫

问题

不停的拖动tab栏,会不断更新布局。
Dragging the tab bar continuously will update the layout constantly.
image

解决办法

通过不断的断点调式,找到原因是因为拖拽过程中swap函数内会不停的更新布局,通过延迟更新布局的方式来实现减少布局更新次数。
By continuously debugging with breakpoints, the cause was found to be that the swap function constantly updates the layout during the drag and drop process. The solution was to reduce the number of layout updates by delaying the update of the layout.

进入 ExtJS 包,打开ux目录下的BoxReorderer.js文件,找到337行的位置,包裹上Ext.defer即可。
Enter the ExtJS package and open the BoxReorderer.js file in the ux directory. Wrap the code at line 337 with Ext.defer to delay its execution.

Like this:

// Make the Box Container the topmost layout participant during the layout.
Ext.defer(()=>{
    container.updateLayout({
        isRoot: true
    });
},300);

持续跟进

当前版本:ExtJS 7.6。这个问题已经反馈给官方了,后续官方可能会解决。
Current version: ExtJS 7.6. This issue has been reported to the official team and they may resolve it in the future.

image

注意(Caution)

小心:未测试此修改会不会对其他组件造成影响,生产环境使用请务必进行具体测试。
Caution: This modification has not been tested for potential impact on other components. Please conduct thorough testing before implementing it in a production environment.

posted @ 2023-04-13 10:40  重庆熊猫  阅读(63)  评论(0编辑  收藏  举报