Mi riferisco ai due tipi di componenti di reazione: componente di presentazione e componente del contenitore. In una descrizione più indipendente dalla piattaforma, il componente contenitore è solo un adattatore per un componente di presentazione e il resto del sistema? O è un'istanza di qualche altro modello?
Se osservi il
Da Wikipedia :
Converts one interface to another so that it matches what the client is expecting
A parte:
Trovo difficile categorizzare questa struttura - o altre "moderne" strutture javascript - nella terminologia del pattern "classica". Ciò che viene forse più vicino è una miscela di delega e mediatore modello. Ma con sprinkles di M e C di MVC. Lo stesso vale per i framework, che si descrivono come MV* o giù di lì.
Per quanto comprendo la distinzione tra container e presentation componente, la prima è la parte computazionale che organizza i dati (qualunque cosa sia necessaria per farlo) e consegna i dati al componente presentation di cui lavoro è quello di "visualizzare" i risultati calcolati. Hanno una relazione parent-child .
Is a react container component an instance of the adapter pattern?
No, non lo è. È qualcosa che nel mondo di React si chiama il modello del componente del contenitore . Come modello generale, però, si adatta alla "delegazione", come già menzionato da Thomas Junk nella sua risposta.
Ma più di un modello, il "componente del contenitore" si basa su un principio: Il principio della singola responsabilità .
Invece di avere un componente che esegue due funzioni: presentazione (1) e recupero dei dati e interazioni di business logic (2), si separano i due. Il componente contenitore gestisce i dati, le azioni, le interazioni commerciali con il resto dell'app, mentre il componente di presentazione gestisce solo la presentazione con oggetti di scena ricevuti dal contenitore e tutte le interazioni dell'utente vengono passate al componente contenitore anziché interagire con il resto di l'applicazione.
Questo ha alcuni vantaggi offerti da Dan Abramov , il creatore di Redux:
Better separation of concerns. You understand your app and your UI better by writing components this way.
Better reusability. You can use the same presentational component with completely different state sources, and turn those into separate container components that can be further reused.
- Presentational components are essentially your app’s “palette”. You can put them on a single page and let the designer tweak all their variations without touching the app’s logic. You can run screenshot regression tests on that page.
- This forces you to extract “layout components” such as Sidebar, Page, ContextMenu and use this.props.children instead of duplicating the same markup and layout in several container components.
Leggi altre domande sui tag reactjs