Mobx和React异步函数调用冻结了UI，而onClick调用却没有冻结

编程问答 2022-06-11

问题描述

因此，我们已经尝试解决了几个小时，无法找出问题所在。恐怕由于公司政策我无法包含任何代码，但是我可以包含示例代码并进行解释。

基本上，我们有一个函数，可以从控制器中选择所有表行（简化）。示例：

 selectAllRows = action(() => {
    this.data.forEach(r=> {
      this.selectTableRow(r,tableInstance)
    })
 })

和selectTableRow只是一个简单的函数，它将值设置为可观察对象：

selectTableRow = action((row,tableInstance) => {
    tableInstance.multiSelectedRows[row.id] = row.id
})

因此，当我们假设有100行时，我们通过调用按钮并通过onClick方法调用selectAllRows函数进行选择，或者如果我们直接在componentDidMount生命周期中对其进行调用，则表行将立即被选择，没有问题-一切都很好。 / p>

一旦从其他任何地方调用此函数，可以说是从esc密钥侦听器调用它，还是用setTimeout函数包装它。该函数一旦执行，就会将UI挂起一秒或2，然后将其选择为正常行-渲染问题，问题未知。

所以问题是我们无法理解为什么直接调用同一函数而不是将其包装在异步函数中时能正常工作。

任何提示或如果有人意识到问题并可以帮助我们，将不胜感激！

编辑：还要注意，我们从函数中删除了所有动作包装，​​并进行了相同的测试，这是相同的问题。 onClick通话执行速度快，而另一个则执行速度慢。

解决方法

我们设法通过更新所有库来解决问题（无论如何，我们每2周进行一次更新），但似乎是mobx问题，因为在mobx更新后，它解决了该问题。

javascriptmobxmobxmobxmobxmobx-reactreactjsreactjsreactjsreactjs