Denormalisierte Entitäten nach Normalizr in Redux

Question

Ich sehe viele Informationen über die Normalisierung Ihres Geschäfts in redux. Aber was machen Sie, wenn Sie Daten aus einem Graphen anzeigen möchten?

Meine Daten sieht wie folgt aus {Kurse: [{Kapitel: [{Zuordnungen: [{... blah}]}]}]}

Jede Einheit verfügt über Daten, die ich auf meinem Handy bin. Schrecklich, Code zu schreiben.

Ich möchte diese Daten auf einer Seite anzeigen, aber alle meine Daten sind normalisiert. Darüber hinaus möchte ID eine Container-Komponente für alle drei Entitäten haben.

Dies scheint sehr schwierig in redux sowohl mit als auch ohne Normalisierung zu tun. Es muss einen empfohlenen Weg geben, damit umzugehen.

Dank

Answer 1

Sie können Container machen, die Id von Daten akzeptiert, die Sie benötigen. Container 'Verbinden Sie die Komponente mit dem Speicher. Dann Komponentenbehälter für die Kinder mit Speicher verbinden und so weiter ..

Um Daten aus Speicher zu erhalten durch ids u überprüfen: Javascript Redux - how to get an element from store by id

Um vorformulierten zu reduzieren Sie Komponente in demselben Modul anschließen können, wie sie es mit drei Ansicht Beispiel:

https://github.com/reactjs/redux/tree/master/examples/tree-view

Offensichtlich Ihre Komponenten werden nicht so dumm mehr sein (außer Blättern Komponenten).

prüfen dieses Beispiel zu: At what nesting level should components read entities from Stores in Flux?

Answer 2

So wie ich um diese bekam, war das Objekt auszuführen, die ich von der Redux Zustand durch eine Denormalisierung Funktion wollte. Ich tat dies innerhalb der mapStateToProps Funktion, die ich dann in connect ging.

Wenn Sie dies auf Container-Ebene tun, dann können Sie wählen, und wählen, welche Teile des vollständig denormalized Objekt dann durch ihre props an andere Komponenten senden (ohne connect mit dem so ist, gibt es keinen wirklichen Nutzen aus Denormalisierung wieder).

Für die Denormalizer-Funktion können Sie die Denormalizr-Bibliothek verwenden. Aber wenn Sie die source code betrachten, ist die tatsächliche Funktion nicht zu groß, sie kann wahrscheinlich geändert werden, um Ihren Notwendigkeiten zu entsprechen und zum Beispiel direkt in den Redux-Zustand zu haken.