Class Component utilities for React Router 6+
npm install react-router-class-toolsClass Component utilities for [React Router][1] 6+
![CI & CD][2]
![NPM][3]
![Demo][4]
https://idea2app.github.io/React-Router-class-tools/preview/
- [x] withRouter() function
- [x] withRouter() decorator
- [x] RouteComponentProps
- [ ] this.props.history
- [x] this.props.location
- [x] this.props.match
- [ ] Static Context
- [x] this.props.query: the missing Query object
``tsx
import { PureComponent } from 'react';
import { RouteComponentProps, withRouter } from 'react-router-class-tools';
type RoutePageProps = RouteComponentProps<
{ id: string },
{},
{ extra: number }
>;
@withRouter
export class RoutePage extends PureComponent
render() {
const { id } = this.props.match.params,
{ extra } = this.props.query;
return (
1. https://github.com/remix-run/react-router/issues/8146
2. https://segmentfault.com/a/1190000041700003
1. https://github.com/idea2app/React-MobX-Bootstrap-ts
2. https://github.com/idea2app/React-MobX-Ant-Design-ts
[1]: https://reactrouter.com/
[2]: https://github.com/idea2app/React-Router-class-tools/actions/workflows/main.yml
[3]: https://nodei.co/npm/react-router-class-tools/
[4]: https://codesandbox.io/s/react-class-router-1y99mv