Flux - 如何處理更新同一視圖的多個商店？

我是一個初學者的助焊劑模型，但我認爲我理解它在高層次：Flux - 如何處理更新同一視圖的多個商店？

事件創建者 - >事件 - >發送 - >存儲 - >查看和我們周圍去！

鑑於flux模型支持多個商店，如果您有一個事件循環指派給2個商店，那麼這個循環會更新相同的視圖。

如何管理來自該過程的無意閃爍？我還沒有完全啓用/使用過反應（我假設一個catch所有的答案都會是這個反應處理這個減少這個重要提升的部分），但是從概念上講這怎麼可能在特定實現之外工作。

由於商店更改是在商店中連續應用的，您是否等到所有商店都停止處理調度員，然後單獨允許他們單獨發起所有更改？即使如此，您仍然會循環並最終發送事件，並且您仍然可能會在UI上重疊更新。

謝謝！

來源

2015-10-27 Aziz Mamhta

你這裏有不同的選擇：

香草液是利用在您的商店，結構waitFor()功能，並確保最終每個組件只有一個店呢監聽。或多或少是這樣的：

需要注意的是，你的動作類型和存儲結構需要同步：每個動作需要到包含在一個WAITFOR週期中的所有店溝通。圖片中的示例將無法觸發渲染。最頂層的商店不會聽取調度員的操作，而正確的商店會一直等待更新。另外，如果只有一個組件，紅線可能會導致類似的死衚衕。我處理這個問題的方法是：讓所有商店在第一行聽所有行動，如果行動無關緊要：發出改變。

另一種選擇是將您的數據整合到一個商店。這不會導致問題消失：您需要處理單個存儲內部的依賴關係問題。但它確實帶走了許多行動，很多waitFors，以及許多改變排放的麻煩..

來源

2015-10-27 22:07:38 wintvelt

請記住，該動作是同步處理的 - 所有存儲都將發出，控制器視圖帶有調用setState等堆棧展開和瀏覽器有機會重新呈現DOM，因此閃爍是不可能的（瀏覽器不會在正在運行的函數中呈現，因爲否則所有DOM操作代碼都會導致隨機閃爍）。但是，正如你所說，可能會有多個商店發佈更改，並且多個組件會監聽它們，因此最終可能會多次調用「setState」（即使在同一個組件上）。這聽起來效率低下，但在大多數情況下並非如此。只要當前動作來自一個來自React的事件（例如，添加到JSX中的組件的事件處理程序），React就會自動將所有對setState的調用分批處理，並僅對DOM進行重新呈現（即，任何所需的DOM更新）一次，立即（和同步）完成處理事件後。有一種情況需要注意 - 如果你從一個React事件處理器以外的東西（比如一個promise.then，一個AJAX回調，setTimeout回調等等）分派一個動作，那麼React將不得不重新調用它，呈現每個對該函數中的setState的單個調用，因爲它不知道何時執行該操作。您可以通過使用無證批處理渲染功能，避免這種情況（0.14，注意0.13有此不同的API）：

ReactDOM.unstable_batchedUpdates(myFunctionThatDispatchesActions);

另一種可能是使用過的，現成的流量實現其做這行你已。見例如https://github.com/acdlite/redux-batched-updates

來源

2015-10-28 18:19:00 TomW

Flux - 如何處理更新同一視圖的多個商店？

回答

相關問題