État normalisé avec chargement partiel et complet des ressources

Question

J'essaie de normaliser mon état et je n'arrive pas à comprendre comment gérer les ressources complètes &, à savoir si elles doivent partager la même tranche d'état ou être reléguées à leurs propres tranches .

Un peu plus d'info:

Quand je fais une demande pour obtenir une liste de things, le serveur répond avec une liste de partials.

[ { id: 1, name: "thing1"}, 
    { id: 2, name: "thing2"}, 
    ... 
    { id: N, name: "thingN"} ] 

Quand je fais une demande pour un seul thing, le serveur répond avec un objet plus complet.

{ 
    id: 1, 
    name: "thing1", 
    img_url: "url1", 
    description: "description1", 
    ... and more fields 
} 

La liste partielle et les informations détaillées doivent toutes deux être présentes en même temps.

Donc ces things partiels et complets devraient-ils tous être dans la même tranche d'état?

Si oui, quelle est la meilleure pratique pour gérer si un thing donné a été partiellement ou complètement récupéré?

Merci pour l'aide!

Answer 1

Quel est le but de l'extraction d'un seul article? Probablement le montrer? Pourquoi ne pas configurer votre état comme:

this.state = { 
    allThings: [], 
    singleThing: {} 
}; 

Et remplissez-le en conséquence.

Answer 2

Vous pouvez aller à ce sujet quelques façons:

1. ont un objet incomplet comme ceci:

   { 
       id: 1, 
       name: 'thing1', 
       detail: null //this would be a JS object when populated 
   } 
   

   Comment vous pouvez utiliser ceci: dans un composant qui utilise la vue détaillée, vous vérifier null sur l'état. Cela signifie que vous pouvez paresser les détails de la charge si vous en aurez besoin dans le futur, et ne pas avoir à les récupérer à nouveau si nécessaire. Cependant, ce n'est pas génial si les informations doivent être mises à jour (vous devrez résoudre à la fois la date nulle et la dernière date de récupération, ce qui peut être risqué pour la création de données périmées).

2. Gérez les deux en tant que nœuds complètement différents sur votre état, où la vue détaillée est soit un tableau, soit simplement un objet singulier. Cette approche fonctionnerait mieux si vous voulez toujours mettre à jour l'objet sur un événement de cycle de vie (par exemple, sur un montage de composant, vous voulez toujours actualiser les données).

Ma préférence personnelle est # 1 - J'utilise Firebase beaucoup et cela fonctionne très bien que le temps réel gère DB lorsque les données doivent être mises à jour, puis de les avoir dans l'état signifie que je peux afficher super de données rapide à l'utilisateur s'il est pré-chargé.