javascript / intermediate
Snippet
Eigene Writable Stores mit gekapselter Logik
Eigene Stores ermöglichen es, die internen 'set'- und 'update'-Methoden zu verbergen und nur fachspezifische Aktionen preiszugeben. Dies verhindert, dass externe Komponenten ungültige Zustände setzen, und hält die Logik zentralisiert.
snippet.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
import { writable } from 'svelte/store';function createCounter() {const { subscribe, set, update } = writable(0);return {subscribe,increment: () => update(n => n + 1),decrement: () => update(n => n - 1),reset: () => set(0)};}export const counter = createCounter();
svelte
Erklärung
1
const { subscribe, set, update } = writable(0);
Destrukturiert die Store-Methoden aus einem neuen Writable-Store, der mit 0 initialisiert wurde.
2
return { subscribe, increment: ... }
Gibt ein Objekt zurück, das 'subscribe' enthält, aber 'set' und 'update' durch spezifische Methoden ersetzt.