Forståelse af Actions og Action Creators

Teori

Actions er informationspakker, der beskriver de ændringer, vi ønsker at foretage i staten. Action creators er funktioner, der opretter actions. De indkapsler logikken for at oprette actions og kan genbruges i hele applikationen.

Praksis

Vi har en fil ved navn counterAction.js i mappen 'actions'. Denne fil definerer actions og action creators til tællerfunktionaliteten.

import { createAction } from "@reduxjs/toolkit";

export const increment = createAction("counter/increment");
export const decrement = createAction("counter/decrement");

Kodeforklaring:

• Linje 1: Importerer funktionen createAction fra pakken @reduxjs/toolkit. Denne funktion forenkler oprettelsen af action creators;
• Linje 3: Opretter action creator-funktionen increment ved hjælp af createAction. Denne funktion genererer actions til at øge tælleren;
  • Strengen "counter/increment", der gives som argument, repræsenterer action-typen. Den hjælper med at identificere actionen, når den bliver dispatcheret.
• Linje 4: På samme måde oprettes action creator-funktionen decrement ved hjælp af createAction. Denne funktion genererer actions til at mindske tælleren.
  • Strengen "counter/decrement" repræsenterer action-typen for at mindske.

Ved at bruge createAction genererer disse funktioner action-objekter med en type-egenskab sat til den angivne typestreng. Disse actions kan dispatches i Redux-reducere eller React-komponenter for at opdatere Redux store.

Bemærk

Action type-strenge, såsom "counter/increment" og "counter/decrement", bør være beskrivende og afspejle formålet med handlingen. Det er almindeligt at tilføje feature- eller slice-navnet som præfiks til action typen for bedre organisering. Brug af strengkonstanter eller variabler anbefales for konsistens og nemmere refaktorering.