2016-10-20 1 views
0

Also sagen wir in React haben wir this.props.viewer.parent.child.
Und lassen Sie uns sagen, dass die Antwort so etwas wieWie werden tief verschachtelte Abfragen behandelt, wenn Felder je nach Anmeldung null sein können oder nicht?

{ 
    "data": { 
    "viewer": { 
     "parent": null 
    } 
    } 
} 

aussehen muss Dies würde erstellen und Fehler in Reaktion (Cannot read property 'child' of null), weil die Eltern null ist.

Was habe ich gedacht, um dieses Problem zu bekommen, ist:

  1. Verwendung https://www.npmjs.com/package/dot-prop , wenn Relais Daten verwenden, aber es scheint wie eine andere Schicht von unnötige Komplexität.
  2. Sie könnten mit if dann rendern, aber das ist auch problematisch, da Sie tief in Komponenten gehen und mit viele ifs überprüfen müssen.
  3. Sie könnten in das GraphQL-Schema gehen und return null bei jeder Feldauflösung hinzufügen. So würde die Antwort wie folgt aussehen:

    { "data": { "Viewer": { "Eltern": { "Kind": null } } } }

Was machen Sie, um dieses Problem zu umgehen? Danke.

Antwort

0

Ich überprüfe, ob irgendein Objekt existiert, bevor ich es benutze.

if (this.props.viewer & this.props.viewer.parent){ doSomething(this.props.viewer.parent.child); }

0

Wir verwenden ramda (in Reagieren oder wo auch immer wir brauchen sie im Stapel), die eine schöne Bibliothek mit der funktionalen Programmierung Utilities ist. Der, den ich hier benutzen würde, wäre der Pfad.

Es verhindert, dass JavaScript immer dann abstürzt, wenn in einem verschachtelten Objekt etwas fehlt.

Wenn Sie sich ramda ansehen, werden Sie feststellen, dass es sich um eine sehr mächtige Bibliothek handelt.

Verwandte Themen