React Component Communication
Portfolio App
Component Structure
Our 3 components before they start communicating
Grandparent -> Parent
- Grandparent defines the callback function
- Then passes it to its child (the parent)
Parent -> Child
- Grandparent defines the callback function
- Then passes it to its child (the parent)
- Parent receives the callback function from its parent (the grandparent)
- Then passes it to its child (the grandchild)
Child -> Grandparent
- Grandparent defines the callback function
- Then passes it to its child (the parent)
- Parent receives the callback function from its parent (the grandparent)
- Then passes it to its child (the grandchild)
- Grandchild receives the callback from its parent (the parent)
- Then calls the callback with arguments invoking the code defined in the grandparent