I have a React frontend and class components inside it. Moving to React 18 and Route 6, some important changes arose. One difficult problem is getting route params. They proudly introduced hooks but all the examples I found are with function components and using useParams. Unfortunately, useParams doesn't work with class components. The only solution I found till now is to use same function components just as wrappers around class components but this is cumbersome, especially when Redux and Thunk are involved. For example, it took me a lot of time only to find out that useDispatch has to be cast to ThunkDispatch and I am sure the problems won't stop here. I also wouldn't like to change all my class components to function components. As a matter fact I prefer the former.
alternative to useParams() in class components in React18, Route 6
68 Views Asked by Gigi At
0
There are 0 best solutions below
Related Questions in REACT-ROUTER
- React Router v6.4 (as per major update in official documentation): Child route component not updating when navigating from parent route
- How can i prevent certain type of user role to access other role route using React Router Dom V6
- Why is profile content displayed instead of post content on React PostPage component?
- Right side of assignment cannot be destructured which using Link component from 'react-router-dom' in react js
- Route not working on refreshing the page in react deployed application
- Why might react-router navigate(-1) go back two routes/pages?
- How correct organize invoking new request with updated query string in RTK query by click button in inner component?
- why is this react login page not working?
- React router dom routing redirect
- connected-react-router not working with react-router v6 I using redux first history error Cannot read properties of undefined (reading 'pathname')
- Outlet of React Router is Appending in root div
- React router has ErrorBoundary or errorElement prop on your route
- Stopping React from running computations in subpage after leaving that subpage
- Typescript Page Routing does not render subpage when clicked (React Router v6)
- 'failed to fetch' error when the form is empty
Related Questions in REACT-18
- React 18 -> RenderToString and @loadable/server creating hydration issue
- React JS: jQuery is not working after React upgraded from version 16.13.1 to 18.2.0
- Why does using Framer Motion give me different results
- Errors while upgrading NextJs version
- Runtime Error ('destroy is not a function' )after upgrading from React V16 to 18
- React 18 and material UI (@mui). Styles wont append through theme
- .webp format images not rendering as expected in React
- componentWillReceiveProps is still working in react 18.2.0
- UseEffect React 18 - Taking a long time to make api calls
- @twilio/video-room-monitor with react 18
- Next.js config is not loading sass files correctly from bootstrap version 5
- alternative to useParams() in class components in React18, Route 6
- Access React component variable from Devtools in production build
- React SSR giving Element type is invalid error
- why globalId is incremented by 2 while I click only one time on Create Todo or submit the form. How to solve it
Trending Questions
- UIImageView Frame Doesn't Reflect Constraints
- Is it possible to use adb commands to click on a view by finding its ID?
- How to create a new web character symbol recognizable by html/javascript?
- Why isn't my CSS3 animation smooth in Google Chrome (but very smooth on other browsers)?
- Heap Gives Page Fault
- Connect ffmpeg to Visual Studio 2008
- Both Object- and ValueAnimator jumps when Duration is set above API LvL 24
- How to avoid default initialization of objects in std::vector?
- second argument of the command line arguments in a format other than char** argv or char* argv[]
- How to improve efficiency of algorithm which generates next lexicographic permutation?
- Navigating to the another actvity app getting crash in android
- How to read the particular message format in android and store in sqlite database?
- Resetting inventory status after order is cancelled
- Efficiently compute powers of X in SSE/AVX
- Insert into an external database using ajax and php : POST 500 (Internal Server Error)
Popular # Hahtags
Popular Questions
- How do I undo the most recent local commits in Git?
- How can I remove a specific item from an array in JavaScript?
- How do I delete a Git branch locally and remotely?
- Find all files containing a specific text (string) on Linux?
- How do I revert a Git repository to a previous commit?
- How do I create an HTML button that acts like a link?
- How do I check out a remote Git branch?
- How do I force "git pull" to overwrite local files?
- How do I list all files of a directory?
- How to check whether a string contains a substring in JavaScript?
- How do I redirect to another webpage?
- How can I iterate over rows in a Pandas DataFrame?
- How do I convert a String to an int in Java?
- Does Python have a string 'contains' substring method?
- How do I check if a string contains a specific word?