Flux er en applikationsarkitektur, som Facebook bruger internt til at bygge webapplikationen på klientsiden med React. Det er ikke et bibliotek eller en ramme. Det er hverken et bibliotek eller en ramme. Det er en slags arkitektur, der komplementerer React as view og følger konceptet Unidirectional Data Flow model. Det er nyttigt, når projektet har dynamiske data, og vi skal holde dataene opdateret på en effektiv måde. Det reducerer køretidsfejl.
sove i javascript
Flux-applikationer har tre hovedroller i håndteringen af data:
- Afsender
- Butikker
- Visninger (React-komponenter)
Her skal du ikke forveksles med Model-View-Controller (MVC) modellen. Selvom der findes controllere i begge, men Flux controller-visninger (visninger) findes øverst i hierarkiet. Den henter data fra butikkerne og videregiver derefter disse data til deres børn. Derudover bruges handlingsskabere - dispatcher-hjælpermetoder til at beskrive alle ændringer, der er mulige i applikationen. Det kan være nyttigt som en fjerde del af Flux-opdateringscyklussen.
Struktur og dataflow
I Flux-applikationen flyder data i en enkelt retning (envejs). Denne datastrøm er central for fluxmønsteret. Dispatcheren, lagrene og visningerne er uafhængige noder med input og output. Handlingerne er simple objekter, der indeholder nye data og typeegenskaber. Lad os nu se på de forskellige komponenter i fluxarkitektur én efter én.
Afsender
Det er et centralt knudepunkt for React Flux-applikationen og styrer al dataflow i din Flux-applikation. Det er et register over tilbagekald til butikkerne. Den har ingen egentlig egen intelligens og fungerer simpelthen som en mekanisme til at distribuere handlingerne til butikkerne. Alle butikker registrerer sig selv og giver et tilbagekald. Det er et sted, der håndterede alle begivenheder, der ændrer butikken. Når en handlingsskaber giver en ny handling til dispatcheren, modtager alle butikker denne handling via tilbagekald i registreringsdatabasen.
Dispatcherens API har fem metoder. Disse er:
Java abstrakt klasse
| SN | Metoder | Beskrivelser |
|---|---|---|
| 1. | Tilmeld() | Det bruges til at registrere en butiks handlingshandler-tilbagekald. |
| 2. | afregistrer() | Det bruges til at afregistrere en butiks tilbagekald. |
| 3. | vent på() | Den bruges til at vente på, at det angivne tilbagekald kører først. |
| 4. | afsendelse() | Det bruges til at sende en handling. |
| 5. | isDispatching() | Den bruges til at kontrollere, om afsenderen i øjeblikket sender en handling. |
Butikker
Den indeholder primært applikationstilstanden og logikken. Den ligner modellen i en traditionel MVC. Det bruges til at opretholde en bestemt tilstand i applikationen, opdatere sig selv som svar på en handling og udsende ændringshændelsen for at advare controllervisningen.
unix oprette mappe
Visninger
Det kaldes også controller-views. Den er placeret i toppen af kæden for at gemme logikken til at generere handlinger og modtage nye data fra butikken. Det er en React-komponent, der lytter til ændringshændelser og modtager data fra butikkerne og gengiver applikationen.
Handlinger
Dispatcher-metoden giver os mulighed for at udløse en afsendelse til butikken og inkludere en nyttelast af data, som vi kalder en handling. Det er en handlingsskaber eller hjælpermetoder, der videregiver dataene til afsenderen.
Fordel ved Flux
- Det er en ensrettet dataflowmodel, som er let at forstå.
- Det er open source og mere et designmønster end en formel ramme som MVC-arkitektur.
- Fluxapplikationen er lettere at vedligeholde.
- Fluxpåføringsdelene er afkoblet.