reactjscomponentsparent-childreact-propsreact-context
How can I pass data between two React components, but the two components have no parent-child relationship?
For example, I have data in a component which is inside "components" folder. Now I want to use the data in an another component which is inside "views" folder. So far I know, Context API will not work here. So how can I pass data in this scenario? Thanks in advance.
Solution
Use Redux by maintaining the states of all child components that you might need in a global store and obtain the data from said store.
https://react-redux.js.org/introduction/getting-started
make sure to use redux toolkit to simplify your setup: https://redux-toolkit.js.org/introduction/getting-started
- How to override a parent class method in React?
- How to make background components visible but inaccessible when React Material UI Backdrop is opened?
- Render method in React carbon design component
- Docker with Vite - env variables are undefined inside the docker container
- Cannot test custom hooks with React 18 and renderHook from testing-library/react
- How to use i18next on a custom Typescript library and a host at the same time?
- React - Displaying a loading spinner for a minimum duration
- How to show the date picker if I click the parent div after explictly hiding the date type input in React?
- Parsing of text from Pdf in reactjs
- onPress in functional react native component not working
- React Router useNavigate with a useEffect hook - proper way to use?
- How to control legend symbols in Apache ECharts StackChart?
- How to create a custom button in react-pdf-viewer?
- How to uninstall Tailwind from React application?
- React.js: Set innerHTML vs dangerouslySetInnerHTML
- How to merge row cells in TanStack React Table v7 to v8
- React - Passing Props
- How to hide bottom navigation bar on a specific screen in react native?
- https://api.ipify.org?format=json fail to fetch
- Different values for block scoped variables in state updater functions
- Removing from list causes initial animation to play when map returns a component
- the transition-color aren't working correctly
- Apply :focus-visible when focusing element programatically
- How to remove overflow: hidden placed by bootstrap 5 modal?
- text loads slowly even on font preload
- How can I align my Bootstrap container to fit the full width of the webpage?
- ReactJS - Ant-Design v4 jalali(persian) datepicker problem
- How to define an array with conditional elements in react
- React functional stateless component, PureComponent, Component; what are the differences and when should we use what?
- Conditional React PropTypes