- For communication between two components that don’t have a parent-child relationship, you can set up your own global event system.
Subscribe to events in componentDidMount(), unsubscribe in componentWillUnmount(), and call setState() when you receive an event.
- Flux | Redux | Cursors | Elm etc
- The two components listen for a change event from the store. Then on change each component can query the store for the information it needs.
- You want to display two tables and you have a React component called Table, that listens to a Table Store. By clicking a table header column, you will sort the data ascending or descending. You will soon notice those tables are syncing
- Use containers to send the rendering data to a reusable component
- React Fiber
Communication between components
- Installation https://www.npmjs.com/package/react-pubsub
- GitHub https://github.com/mroderick/PubSubJS
- Answers https://www.ctheu.com/2015/02/12/how-to-communicate-between-react-components/#events-systems
- A simple React framework based on Pub/Sub
- Egghead Flux Video: https://egghead.io/articles/gentle-introduction-to-the-react-flux-architecture
- egghead “React Flux”
- smart and dumb components
- Egghead Redux Video: https://egghead.io/courses/getting-started-with-redux