Warum fängt der Fehlerhandler meiner http-Bibliothek * alle * Laufzeitfehler in der App ab?
Ich baue eine Prototyp-App mit React Native 0.39, die einige Daten von einer entfernten Quelle anfordert. Um die Anfrage zu stellen, verwende ich Axios.
Der Anruf scheint ziemlich einfach zu sein. In einer Komponente namens TownsList.js mache ich
Das Seltsame ist jetzt, dass, wenn ich einen anderen Laufzeitfehler in meinem Code innerhalb von // Do stuff witt the successful result block habe - zum Beispiel ein falsch eingerichteter Verweis auf eine Konstante oder Variable - dieser Fehler ebenfalls von Axios 'Fehlerhandler behandelt wird :
Das fühlt sich nicht richtig an. Was mache ich falsch? Sollte ich "generische" Fehlerbehandlung irgendwo anders in meiner App einrichten, um diese Dinge zu erfassen? Oder ist das beabsichtigte Verhalten?
3 Antworten
Dies ist das natürliche Verhalten, wenn ein Fehler in dem Block ausgelöst wird, den Sie als
markiert haben %Vor%Wenn Sie dieses Verhalten nicht möchten, sollten Sie es folgendermaßen schreiben:
%Vor% Die .then() -Methode erlaubt zwei Funktionen, eine für den Erfolg, die andere für den Fehler - das Scheitern des ursprünglichen Versprechens, das heißt nicht der Erfolgsfunktion.
Da Ihr eigener Code aus irgendeinem Grund selbst versagt, möchten Sie das sicherlich nicht zum Schweigen bringen.
Wie Malvolio erwähnt hat, ist es das erwartete Verhalten, wenn eine catch -Methode auf einer Promise definiert wird, alles, was sie auslöst, wird abgefangen.
Für mich wäre der beste Weg, um diese Art von Verhalten zu handhaben, die Verwendung von Redux, da es Bedenken zwischen Ihren Komponenten und den Daten, die sie benötigen, trennt. Auch wenn ich Ihr Wissen im React-Ökosystem nicht wirklich kenne und Sie sagten, es sei nur ein Prototyp, denke ich, dass es am besten wäre, dieses Paradigma zu verwenden, je früher, desto besser. Hier sind die Motivationen hinter Redux, die es wert sind gelesen zu werden.
Um zu beginnen, müssen Sie einen Redux-Shop erstellen , den Sie zusammenstellen können mehrere Reduzierungen, die kleine unabhängige Partitionen Ihres Staates darstellen, um einen sehr kontrollierten Zugriff zu ermöglichen.
Ihr städtischer Reduzierer könnte so aussehen und würde Ihnen auch erlauben, Lade- und Fehlerstatus zu erhalten:
%Vor% Und hier ist ein Beispiel für eine Store-Erstellung: combineReducers :
Um Ihre Komponenten und die Reduzierstücke zu verbinden, müssen Sie Thunk-Aktionen erstellen (also die Middleware im Geschäft). Seien Sie sich bewusst, dass dies nur eine Möglichkeit ist, um Nebenwirkungen mit redux zu behandeln! Es gibt mehrere Wege, um damit umzugehen, aber dies ist einer der einfachsten und am häufigsten mit zu beginnen.
%Vor% Um Ihre Komponenten mit Ihrem Geschäft "in Verbindung" zu bringen, was bedeutet, dass sie erneut rendern, sobald sich eine ihrer Requisiten ändert, müssen Sie die react-redux Provider -Komponente auf der obersten Ebene Ihrer App, und dann können Sie Ihre Komponenten dekorieren und nur die Daten verwenden, von denen die Komponente abhängt an.
Ihre Komponente würde dann so aussehen, und wenn ein Fehler beim Rendern der untergeordneten Komponenten auftreten sollte, wird sie nicht von der Axios Promise abgefangen, da sie von Ihrer Komponente getrennt wurde.
%Vor%Ich verstehe, dass dies ein wenig anstößig sein kann, wenn Sie nicht mit all den neuen Abhängigkeiten und dem bisschen Konfigurationsaufwand vertraut sind, aber ich kann Ihnen versichern, dass es auf lange Sicht wert ist!
Es kann zwei Bedingungen geben: -
1) Laut mir verwenden Sie try block an einer beliebigen Stelle im Code, der seinen catch-Block im componentDidMount findet. Deshalb wurden andere Fehler in Ihrem catch-Block gefunden.
2) Jede Warnung oder Fehler in Ihrem Code ist Roaming frei und es wurde von Ihrem catch-Block abgefangen, so würde ich Ihnen empfehlen, try Block mit catch-Block oder versuchen Sie mit endlich oder nur endlich.
so:
%Vor%Tags und Links react-native reactjs