javascript / beginner
Snippet
Parsen von JSON-Konfigurationen mit Try Catch in Vue
Die try...catch-Anweisung definiert einen Anweisungsblock, der ausgeführt wird, und fängt Fehler ab, falls eine Ausnahme auftritt. Beim Parsen von benutzerdefiniertem JSON-Text mit JSON.parse() verhindert das Abfangen von Fehlern Anwendungsabstürze und ermöglicht das Setzen einer Fehlermeldung im reaktiven Zustand.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
import { ref } from 'vue';export default {setup() {const rawInput = ref('{"theme": "dark"}');const parsedConfig = ref(null);const errorMessage = ref('');function parseInput() {try {errorMessage.value = '';parsedConfig.value = JSON.parse(rawInput.value);} catch (err) {errorMessage.value = 'Invalid JSON format';}}return { rawInput, parsedConfig, errorMessage, parseInput };}};
vue
Erklärung
1
try {
Beginnt einen geschützten Block, in dem Laufzeitfehler abgefangen werden können.
2
parsedConfig.value = JSON.parse(rawInput.value);
Versucht, den Eingabe-String in ein JavaScript-Objekt zu parsen.
3
} catch (err) {
Fängt etwaige Syntaxfehler ab, die beim Parsen auftreten.
4
errorMessage.value = 'Invalid JSON format';
Aktualisiert die reaktive Fehlermeldung, um den Benutzer über das ungültige Format zu informieren.