javascript / expert
Snippet
Dependency Injection via Context für entkoppelte Services
Die Implementierung von Dependency Injection (DI) ermöglicht es, die Komponentenlogik von spezifischen Service-Implementierungen zu entkoppeln. Dies macht es einfach, einen echten API-Service während Unit-Tests oder der lokalen Entwicklung gegen einen Mock auszutauschen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
const ApiContext = createContext<ApiService | null>(null);export const useService = () => {const service = useContext(ApiContext);if (!service) throw new Error('Service not provided');return service;};const App = ({ serviceImplementation }: { serviceImplementation: ApiService }) => (<ApiContext.Provider value={serviceImplementation}><Dashboard /></ApiContext.Provider>);
react
Erklärung
1
createContext<ApiService | null>(null)
Erstellt einen Container für die Abhängigkeit, die auf Root-Ebene erfüllt werden kann.
2
if (!service) throw new Error(...)
Eine Sicherheitsprüfung, um sicherzustellen, dass Komponenten immer in den entsprechenden Provider eingewickelt sind, was das Debugging verbessert.