UI是渲染的，但是除非触摸，否则屏幕不会绘制

Question

我们能够确认我们组件的render()方法已被调用。我们还看到，需要显示的数据通过道具正确传递。但是，在触摸之前，实际的手机显示不会重新粉刷更新的UI。

有趣的是，这仅发生在生产构建中，而不是在应用程序的开发构建中。叹息。

过去，我们在InteractionManager.runAfterInteractions完成更新时已经看到了这一点，但是在这种情况下，我们删除了runAfterInteractions的所有使用，并且仍在看到此行为。

使用反应天然0.57，但在0.58上也看到了相同的问题。

我可以在需要时提供更多的具体细节，但想知道是否有人以前看过类似的东西，以及他们为解决此类问题做了什么。

Answer 1

我也遇到了这个问题，当时应该重新粉刷的内容在'scrollview'中。我使用" flatlist"而不是" scrollview"重新分配了我的代码，并且问题消失了。

Answer 2

这是一场挣扎，但我弄清楚了发生了什么。

tl; dr

解决方案是在您从传递给runAfterInteractions或从Realm回调的函数中进行UI更新时，将您的Redux Action调度包装在setTimeout(..., 0)中。

一些快速背景：

我正在派遣REDUX操作，内部回调。此操作反过来会导致UI重新渲染，除非渲染的UI在触摸之前不会在屏幕上重新粉刷。

当您从传递给InteractionManager.runAfterInteractions的回调中派遣Redux动作时，观察到类似的行为。这是有道理的，因为回电传递给runAfterInteractions等待UI执行其操作，然后作为setImmediate批次执行。这些回调旨在用于重大的背景工作，否则将阻止UI渲染。因此，如果有人在这样的回调中进行UI渲染，那本身会像背景工作一样被停止！

解决方案：

领域回调的重点是通知您某些数据已更改，以便您可以重新渲染UI。但是，领域的回调的行为就像传给了runAfterInteractions，因此UI的重新订阅被延长了。我采取了信心的飞跃，决定将redux动作分配代码转移到其他队列，即setTimeout。这是修复的样子：

... 
// assume this is in a callback passed to runAfterInteractions
// or in a realm callback
      // PUT YOUR REDUX ACTION DISPATCHES IN A setTimeout
      // callback
      setTimeout(() => {
        getFilteredCartAreas(dispatch, realm)
        dispatch(new ActionCartAreaCardChanged())
      }, 0)
...

修复程序是在传递给setTimeout的回调中执行UI渲染逻辑。注意零延迟；目的是将逻辑简单地移至不同的队列，而UI互动不限制。