如何优化子组件中事件的布局性能?

Question

我有一个具有这种设计的组件。 这不是代码，只是组件结构的高级表示。

Container {
child1 : {
},
child2 : {
},
child3 : {
},
...
}
Child component : {
event that will cause layout update
}

现在，每当事件在子组件中触发时，页面都会变得非常慢。由于事件代码是在组件中编写的，因此我不确定如何使用 suspendLayout((。

知道吗？

Answer 1

你可以使用 batchLayout。这将暂停所有布局，直到您的函数完成。

Container {
child1 : {
},
child2 : {
},
child3 : {
},
...
}
Child component : {     
// event that will cause layout update
event: function() {        
const me = this;
Ext.batchLayouts(function() {
// Your code            
}, me);
}
}