Flux er en applikasjonsarkitektur som Facebook bruker internt for å bygge nettapplikasjonen på klientsiden med React. Det er ikke et bibliotek eller et rammeverk. Det er verken et bibliotek eller et rammeverk. Det er en slags arkitektur som utfyller React as view og følger konseptet Unidirectional Data Flow-modellen. Det er nyttig når prosjektet har dynamiske data, og vi må holde dataene oppdatert på en effektiv måte. Det reduserer kjøretidsfeilene.
liste sorter java
Flux-applikasjoner har tre hovedroller i håndteringen av data:
- Avsender
- Butikker
- Visninger (React-komponenter)
Her bør du ikke forveksles med modellen Model-View-Controller (MVC). Selv om kontroller finnes i begge, men Flux-kontroller-visninger (visninger) finnes øverst i hierarkiet. Den henter data fra butikkene og sender deretter disse dataene videre til barna deres. I tillegg, handlingsskapere - dispatcher-hjelpemetoder som brukes til å beskrive alle endringer som er mulig i applikasjonen. Det kan være nyttig som en fjerde del av Flux-oppdateringssyklusen.
Struktur og dataflyt
I Flux-applikasjonen flyter data i en enkelt retning (enveis). Denne dataflyten er sentral i fluksmønsteret. Senderen, lagrene og visningene er uavhengige noder med innganger og utganger. Handlingene er enkle objekter som inneholder nye data og type-egenskap. La oss nå se på de ulike komponentene i fluksarkitektur én etter én.
Avsender
Det er et sentralt knutepunkt for React Flux-applikasjonen og administrerer all dataflyt for Flux-applikasjonen din. Det er et register over tilbakeringinger inn i butikkene. Den har ingen reell egen intelligens, og fungerer rett og slett som en mekanisme for å distribuere handlingene til butikkene. Alle butikker registrerer seg og gir tilbakeringing. Det er et sted som håndterte alle hendelser som endrer butikken. Når en handlingsskaper gir en ny handling til koordinatoren, mottar alle butikker den handlingen via tilbakeringingene i registeret.
Senderens API har fem metoder. Disse er:
Java abstrakt klasse
| SN | Metoder | Beskrivelser |
|---|---|---|
| 1. | registrere() | Den brukes til å registrere en butikks handlingsbehandler tilbakeringing. |
| 2. | avregistrer() | Den brukes til å avregistrere en butikks tilbakeringing. |
| 3. | vent for() | Den brukes til å vente på at den angitte tilbakeringingen skal kjøre først. |
| 4. | sende() | Den brukes til å sende en handling. |
| 5. | isDispatching() | Den brukes til å sjekke om koordinatoren sender en handling. |
Butikker
Den inneholder først og fremst applikasjonstilstanden og logikken. Den ligner på modellen i en tradisjonell MVC. Den brukes til å opprettholde en bestemt tilstand i applikasjonen, oppdaterer seg selv som svar på en handling, og sender ut endringshendelsen for å varsle kontrollervisningen.
verilog alltid
Visninger
Det kalles også kontroller-visninger. Den er plassert på toppen av kjeden for å lagre logikken for å generere handlinger og motta nye data fra butikken. Det er en React-komponent som lytter til endringshendelser og mottar data fra butikkene og gjengir applikasjonen.
Handlinger
Dispatcher-metoden lar oss utløse en sending til butikken og inkludere en nyttelast med data, som vi kaller en handling. Det er en handlingsskaper eller hjelpermetoder som sender dataene til avsenderen.
Fordel med Flux
- Det er en enveis dataflytmodell som er lett å forstå.
- Det er åpen kildekode og mer et designmønster enn et formelt rammeverk som MVC-arkitektur.
- Fluksapplikasjonen er lettere å vedlikeholde.
- Flusspåføringsdelene er frakoblet.