2016-10-03 65 views
0

這是數天或數週可能(閱讀文章,觀看視頻/會談),我試圖瞭解如何正確使用終極版和redux-form但它確實對我來說很難完全掌握的概念。也許我的用例不適合Redux,或者我只是錯過了明顯的東西。如何使redux-form(或Redux)在本地數據庫中工作良好?

我試圖尋找是一個大的應用提供了良好的基礎。我對React很有信心,但是Redux(並且因此,還原形式)對於我沒有的問題似乎是一個很好的解決方案。儘管如此,大家都讚賞Redux(或flux)的概念,所以我想確保我不會錯過任何東西。

好,應用在很大程度上數據庫驅動在瀏覽器(這是一個離線首次應用)一應俱全的所有數據。

我使用的瀏覽器數據庫非常相似NeDB加上Mongoose般的ODM,但實際上該數據庫是,我想開源,一旦它足夠穩定(另)一個自定義的項目(我確實有實現它已經和它的作品非常好爲止)。

該數據庫(有關這個問題)的關鍵點可能是它有在瀏覽器中隨時可用的所有數據,它支持「現場查詢」 - 這意味着我可以訂閱對數據庫的更改和最新的查詢結果直接推送到任何消費組件/處理程序。此外,數據庫會自動同步在後臺服務器(雙向)的所有數據,這意味着集合可以在任何時刻改變內容。

由於我使用的是Material UI UI前端。

應用程序本身將管理許多不同的集合,我需要爲用戶實現許多表單,以便他可以編輯某些集合中的單個文檔。根據應用程序中的上下文,用戶將看到當前集合中所有文檔的列表,以及顯示該列表中當前選定文檔的詳細信息的表單。該表格當然也會允許更改文件。用戶可能一次只能編輯(查看)一個集合/表單。

爲了便於理解,閱讀快速MockupUI sketch

左邊的列表是可笑容易做反應,上述的現場查詢。它也是「被動的」,因爲它總是與數據庫同步。但是,它目前不使用Redux。我不確定這是否不好。

單擊該列表中的任何項目時,細節應顯示在右側的表單中。

我喜歡redux-form(v6)概念,但我無法弄清楚如何將文檔數據提供給表單。我知道有initialValues,但我不明白如何正確使用它。

我想我需要將文檔數據以某種方式推入Redux,以便它反映在窗體中。我是否需要「啓動」Redux操作將數據推送到商店?

另一方面,使用經典的React 狀態將列表中的文檔(一個簡單的JS對象)傳遞給我的表單組件似乎對我而言非常簡單。 目前我沒有看到在Redux商店中擁有全局表單狀態的好處。但是,我可能需要比redux-form更多的東西(找不到任何可比的東西)。

Redux與我的數據庫似乎也是多餘的,因爲最終都是全球數據存儲。

對什麼都沒有做數據庫內容,如應用狀態指示燈和切換全球drawer少數國家做使用終極版了。我也使用redux-router(並且最終想鏈接當前列表選擇一個唯一的URI)。然而,我很難找到Redux與數據庫/數據庫相關組件之間的泛音鏈接。

所以,我的問題到底是:什麼是合理的方式來實現應用程序的這些部分? Redux或不Redux?無論哪種情況:它如何實施?

回答

0

如果您的所有數據在本地可以或多或少同步獲得,Redux可能不適合您的應用程序。但是,如果您想使用Redux Form,它提供了很多表單狀態管理,即使您僅將它用於Redux Form reducer,也需要使用Redux。

要初始化表單,您可以將值通過initialValues支持傳遞給裝飾表單組件,或者您也可以自己調用dispatch(initialize(formName, formValues))

+0

說什麼......我之前嘗試過'initialValues',但失敗了。我想我在學習太多之後「沒有看到樹林的木頭」,並犯了一些愚蠢的錯誤。無論如何,我再次嘗試,它像一個魅力。真棒! :-) –

相關問題