如何在Flux和React.js中處理不改變視圖的動作

Question

在Flux中，每個動作都應由調度員處理。

不會更改視圖或標記的操作（例如“將該元素滾動到視圖中”）如何處理？ 處理這種情況的“通量”是什么？ 要繞過調度員？ 還是要在調度員中處理它而不涉及商店或組件？

Answer 1

如果您的應用程序不需要了解滾動（似乎很少知道），則無需執行操作。 由於Flux確實可以處理數據流（以及基於該數據流的后續更改），因此它不需要知道發生的每個操作。

Answer 2

Flux實際上更多地是關於應用程序狀態管理，而不是關於在視圖中呈現哪些組件的細節。 那就是React的領域。 Flux只是假設您具有某種反應性視圖層-通常是React。

應用程序狀態與組件狀態不同。 應用狀態是需要在多個組件中了解的狀態。 對於組件狀態，React的this.state非常合適。 輸入組件是可能需要此功能的一個很好的例子。

因此，在您的情況下，如果僅一個組件需要知道滾動位置，則可能沒有很好的理由將該狀態移至Flux Store。 但是，一旦需要在多個組件（尤其是樹的不同分支中的組件）中知道這一點，您就可能希望在商店中對該狀態進行管理。

您提出的另一個問題是助焊劑作用的作用。 Flux應用程序始終使用操作作為數據流的來源。 這樣做有很多充分的理由：穩定的應用程序狀態，使應用程序對新功能具有彈性，易於推理，撤消歷史記錄，重構應用程序狀態，無狀態視圖組件等。

有時人們希望編寫盡可能少的代碼，並且他們使用在組件之間傳遞的回調來更改父組件中的this.state ，而不是分派新的操作來通過Flux數據流。 我發現這混和了應用程序的視圖和狀態管理層，盡管很方便，但這可能會引起很多麻煩。 從長遠來看，它不是很靈活，因為現在狀態與這幾個組件相關。 從長遠來看，從一開始就建立Flux數據流要簡單得多，並且對新功能的適應性也要強得多。 也就是說，它還需要在代碼上進行更多的投資。