Flux Architektur Kreisabhängigkeit

Question

Ich habe angefangen, Facebooks Flux-Architektur zu lernen. Ich versuche einen einfachen Anmeldebildschirm zu erstellen. Ich habe die Beispielanwendung flux-chat verfolgt, um den Bildschirm zu erstellen. Ich habe ein Problem der zirkulären Abhängigkeit zwischen ServerActionCreator und WebAPIUtils. Bitte beachten Sie den folgenden Code.

ServerActionCreator.js

var AppDispatcher = require('../dispatcher/AppDispatcher'); 
var Constants = require('../constants/Constants'); 
var WebAPIUtils = require('../utils/WebAPIUtils'); 

var ActionTypes = Constants.ActionTypes; 

module.exports = { 
    receiveLoginStatus: function(status){ 
     AppDispatcher.handleServerAction({ 
      type: ActionTypes.RECEIVE_LOGIN_STATUS, 
      status: status 
     }); 
    }, 

    loginSubmit: function(data){ 
     WebAPIUtils.login(data); 
    } 
} 

WebAPIUtils.js

var ServerActionCreator = require('../actions/ServerActionCreator'); 

module.exports = { 
    login: function (data) { 
     //Mock server API call 
     var status = JSON.parse('{"status":"success"}'); 
     ServerActionCreator.receiveLoginStatus(status); 
    } 
}; 

Wie Sie ServerActionCreator hängt von WebAPIUtils und WebAPIUtils hängt ServerActionCreator sehen können.

Ich denke, aufgrund der zirkulären Abhängigkeit wird WebAPIUtils ein leeres Objekt und ich bekomme "undefined ist keine Funktion" Fehler, wenn LoginSubmit-Funktion in ServerActionCreator aufgerufen wird. Screenshot unten.

Wie dieses Szenario behandeln? oder Gibt es einen alternativen Weg? Jede Hilfe wird sehr geschätzt.

Answer 1

Wenn Sie eine zyklische Abhängigkeit zwischen Modulen haben, ist es eine gängige Lösung, entweder die Module zu kombinieren oder eine dritte Entität zu erstellen, die den Zyklus durchbricht.

In Ihrem Fall würde ich argumentieren, dass Sie loginSubmit zu einem anderen Aktion Ersteller Modul verschieben könnten. Es ist eigentlich eine Benutzeraktion, keine Serveraktion. Also vielleicht loginSubmit könnte in UserActionCreators.js zusammen mit einer beliebigen Anzahl von anderen Benutzer Aktion Creator-Methoden gehen.

Eine andere Lösung für Ihr Problem (und im Allgemeinen für zirkuläre Abhängigkeiten) ist, Ihre Methoden reiner zu machen, Abhängigkeiten zu entfernen und stattdessen Abhängigkeiten als Argumente zu übergeben. So könnte WebAPIUtils.login() ein zweites Argument nehmen, das wäre der Erfolgsrückruf. Also:

WebAPIUtils.login(data, ServerActionCreator.receiveLoginStatus)