Menu
It is mentioned in many articles that Container Components are used to fetch data and dispatch actions. Presentation Components are used to define how that data is rendered.
It also suggests that container components should never have their own style.
Here's the question:
I have 3 presentation components, all consumed by 1 container component. The container component fetches the data and provides the required data to each presentation component.
May I wrap and style the presentation components in the container component for styling purposes. For instance, I'd like to style the presentation components to use render in a grid?
719
Container components can be primarily referred to as the parent elements of other components in a React app. They serve as a bridge between the normal components that render the UI and the logic that makes the UI components interactive and dynamic. The most common function of a container component is to obtain data.
What is the difference between component and container in React Redux? Component is a class or function component that describes the presentational part of your application. Container is an informal term for a component that is connected to a Redux store.
The React container pattern is a handy way to abstract complex logic from your UI code. It allows you to reuse the common logic of your application in a declarative way. If you'd like to get more web development, React and TypeScript tips consider following me on Twitter, where I share things as I learn them.
Finally at the conclusion we can conclude in simple terms that the presentational components are concerned with the look, container components are concerned with making things work.
Nest your presentation components in a parent that isn't a container.
Add styling to this parent
Job done.
138
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
