javascript / intermediate
Snippet
Komplexes State-Management mit useReducer
useReducer ist normalerweise vorzuziehen gegenüber useState, wenn eine komplexe Zustandslogik vorliegt, die mehrere Teilwerte umfasst oder wenn der nächste Zustand vom vorherigen abhängt.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
const reducer = (state, action) => {switch (action.type) {case 'increment': return { count: state.count + 1 };case 'decrement': return { count: state.count - 1 };default: throw new Error();}};function Counter() {const [state, dispatch] = useReducer(reducer, { count: 0 });return (<button onClick={() => dispatch({ type: 'increment' })}>{state.count}</button>);}
react
Erklärung
1
const [state, dispatch] = useReducer(reducer, initialArg)
Gibt den aktuellen State zusammen mit einer Dispatch-Methode zurück.