2017-02-22 2 views
2

Ich arbeite in einer komplexen React App, die mit Async-Aufrufen, die Deeply Big JavaScript-Objekte bringt, behandelt. Ich frage mich, was ist der bessere Weg, um einen Zustand zu erstellen, um diese Objekte zu speichern. Die Reduxdokumente sagt:Wie sollte Redux State Anatomie sein?

In einer komplexeren App, werden Sie wollen, dass verschiedene Entitäten sich gegenseitig referenzieren. Wir schlagen vor, dass Sie Ihren Zustand so normal wie möglich halten, ohne Verschachtelung. Halten Sie jede Entität in einem Objekt mit einer ID als Schlüssel gespeichert und verwenden Sie IDs, um sie von anderen Entitäten oder Listen zu referenzieren. Stellen Sie sich den Status der App als Datenbank vor. Dieser Ansatz ist in der Dokumentation von normalizr im Detail beschrieben. Zum Beispiel wäre todosById: {id -> todo} und todos: array innerhalb des Status eine bessere Idee in einer echten App, aber wir behalten das Beispiel einfach.

Wenn ich nur die Referenzen in meinem Zustand speichern, wo ich meine Objekte speichern soll?

Macht diese Frage Sinn?

Was ist besser für den Redux-Zustand? Ein großer abgeflachter Zustand? Oder ein mittlerer nicht abgeflachter Zustand?

+0

Dies sollte helfen. http://stackoverflow.com/questions/34531563/pattern-for-updating-multiple-parts-of-redux-state –

Antwort

4

Wenn ich die Referenzen nur in meinem Zustand speichern, wo ich meine Objekte speichern soll?

Sie speichern Ihre Objekte weiterhin in diesem Zustand. Was das Zitat versucht zu sagen ist, anstatt eine Liste von todos Speicherung:

{ 
    todos: [ 
    { 
     id: '1', 
     value: 'Pay rent', 
     completed: false 
    }, 
    { 
     id: '2', 
     value: 'Buy food', 
     completed: true 
    } 
    ] 
} 

Sie könnten die todos von id referenzierten speichern und in der To-do-Liste, die Sie nur die Referenz behalten:

{ 
    todosById: { 
    1: { 
     id: '1', 
     value: 'Pay rent', 
     completed: false 
    }, 
    2: { 
     id: '2', 
     value: 'Buy food', 
     completed: true 
    } 
    }, 
    todos: [1, 2] 
} 

Es gibt einige Vorteile dieses Ansatzes. Bearbeiten einer Todo ist wirklich einfach und Sie müssen nicht todos Zustand berühren. Wenn Sie später eine todo in einer anderen Liste von todos verweisen mögen, brauchen Sie nicht das ganze todo Objekt zu kopieren, können Sie einfach eine neue Liste mit Referenzen erstellen, zum Beispiel:

allTodos: [1, 2], 
urgentTodos: [1] 

Was Ihre zweite Frage :

Was ist besser für Redux-Zustand? Ein großer abgeflachter Zustand? Oder ein mittlerer nicht abgeflachter Zustand?

Das hängt wirklich von Ihrer App ab.

Verwandte Themen