DEV Community

Diomedes Lajara
Diomedes Lajara

Posted on

Propping components

The most important thing is to pass data from parent component to children components using props. Also to customize how a component interacts/behaves or the looks/style of it.

The content inside a component’s tags can be called using props.children. This is used to place anything from text to jsx or even another component, which makes it a child component from another file.

Three parts of a Component
Nesting: comp inside another comp
Create a new component but only import one react library and instead of rendering the component, export it using default followed by the name of the component.

Reusability: flexibility for multiple uses. few/simple components as possible
Do not forget to import the component at the top of the main index.js file and also calling the component using tags

Configuration: props is used to configure a component
Use props as the first argument/parameter? Of the component function. Using dot notation to invoke the prop like an object call.
The prop goes after the component name like passing style or className as if it was and HTML/JSX tag.

https://thepracticaldev.s3.amazonaws.com/i/spgxnfggv3sh8xlfyrjt.png

...justnotes

Discussion (0)