javascript / beginner
Snippet
Sicheres Parsen von Benutzerkonfigurationen mit Try Catch in Vue
JSON.parse löst einen synchronen SyntaxError aus, wenn ungültige JSON-Zeichenketten geparst werden. Durch das Kapseln in einem try...catch-Block wird der Fehler abgefangen und eine verständliche Fehlermeldung in einer reaktiven Vue-Referenz gespeichert, ohne die Komponente zum Absturz zu bringen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
import { ref } from 'vue';export default {setup() {const config = ref(null);const errorMessage = ref('');function parseConfigString(rawJson) {try {errorMessage.value = '';config.value = JSON.parse(rawJson);} catch (err) {errorMessage.value = 'Invalid JSON configuration: ' + err.message;}}return { config, errorMessage, parseConfigString };}};
vue
Erklärung
1
try {
Startet einen geschützten Ausführungsblock für Operationen, die Fehler werfen können.
2
config.value = JSON.parse(rawJson);
Parst die eingehende JSON-Zeichenkette in ein JavaScript-Objekt.
3
} catch (err) {
Wird nur ausgeführt, wenn JSON.parse fehlschlägt, und fängt das Fehlerobjekt zur Behandlung ab.