ReactJs + Redux :如何像BlockUi blockUI一样简单地完成jQuery？

Question

在redux存储中，我可以将Thunk用于异步状态：fetching_data，并执行render()来阻止元素。

但我认为这需要做很多工作。如果我有许多blockUi组件。

有什么最佳实践可以让它像一样简单

 $('#container-1').blockUi();   
 $('#container-1').unBlockUi(); 

  $('#container-2').blockUi();  
  $('#container-2').blockUi();   

Answer 1

您可以使用类似于反应块-用户界面的东西，它有一个特定的组件，用于根据redux (https://availity.github.io/react-block-ui/components/reduxblockui/)中分派的操作来阻塞和解除阻塞。

它很简单的反应块-ui。

<ReduxBlockUi block="REQUEST_START" unblock="REQUEST_SUCCESS">
  <p>The Thing I am Blocking</p>
</ReduxBlockUi>

现在，当REQUEST_START操作被分派时，部分将开始阻塞，而当REQUEST_SUCCESS被分派时，它将停止。您可以将这些操作名称更改为正在使用的操作名称。

有一个中间件部分，请参阅有关https://availity.github.io/react-block-ui/components/reduxblockui/的示例和文档以获得更多信息。