在沒有商店的情況下，使用ReactJS和Flux架構從服務器獲取數據的正確方法是什么？

Question

我有一個用ReactJS庫用js編寫的前端應用程序。 我確實使用Flux架構來支持我的數據流。 開始時，前端初始化時，它會從服務器（如初始appstate）中檢索數據-不同的實體，然后將它們保存到適當的存儲區中。 這些存儲觸發“更改”事件，並且所有組件均使用來自存儲的數據進行渲染。 后來，前端工作從這些存儲中獲取必要的數據。

現在，我需要構建一種報告，並且在前端構建報告效率不高。 我決定使用服務器上的原始數據進行所有計算並獲得響應。 這應該通過AJAX請求完成。 根據Flux架構，我需要將它們存儲起來，它們的組件應該從那里拿走。 但是，創建新商店（如ReportStore）沒有任何意義。 我該如何處理？ 我可以直接從組件請求數據並違反模式嗎？ 如果是，請提供示例代碼。

Answer 1

為什么沒有ReportStore ？ Reports是您要在客戶端上讀取並顯示在組件中的數據。 如果您想使用AJAX來啟動數據加載，我將使用這樣的幫助器組件來從前端請求您的報告。

var ReportViewActions = {

   getReports: function(requestObject) {

        $.ajax({
            url: '/reports',
            type: 'GET',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            data: requestObject
        }).then(function(newReports) {
            AppDispatcher.handleViewAction({
                type: ReportActionTypes.RECEIVE_REPORTS,
                reports: newReports
            });
        });
   }
}

並在商店中收聽事件。 這樣，如果您要推送報告或讓其他組件訂閱ReportStore一切都已設置。