Grundlegendes zur integrierten Statusverwaltung von React

Reacts integrierte Zustandsverwaltung basiert auf den useState- und useReducer-Hooks, um den Zustand innerhalb von Komponenten zu verwalten. Hier ist eine Aufschlüsselung:

1. useState:

   • Dieser Hook wird zum Verwalten des lokalen Komponentenstatus verwendet. Es gibt ein Array mit zwei Elementen zurück: dem aktuellen Statuswert und einer Funktion, um ihn zu aktualisieren.
   • Beispiel:

    const [count, setCount] = useState(0);
   
    // Update state
    setCount(count + 1);
   

2. useReducer:

   • Für komplexere Zustandslogik wird useReducer verwendet. Es funktioniert ähnlich wie Redux, indem es eine Reduzierfunktion und einen Anfangszustand übernimmt und den aktuellen Zustand und eine Dispatch-Funktion zurückgibt.
   • Beispiel:

    const initialState = { count: 0 };
   
    function reducer(state, action) {
      switch (action.type) {
        case 'increment':
          return { count: state.count + 1 };
        case 'decrement':
          return { count: state.count - 1 };
        default:
          return state;
      }
    }
   
    const [state, dispatch] = useReducer(reducer, initialState);
   
    // Dispatch actions
    dispatch({ type: 'increment' });
   

Diese Hooks helfen dabei, den Status innerhalb von Komponenten lokal zu verwalten, ohne dass externe Bibliotheken erforderlich sind.

Das obige ist der detaillierte Inhalt vonGrundlegendes zur integrierten Statusverwaltung von React. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!