N00b's Programming Machine

    react-router-class-tools
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.2 • Public • Published

    React Router class tools

    Class Component utilities for React Router 6+

    CI & CD

    NPM

    Demo

    Feature

    • [x] withRouter() function
    • [ ] 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

    Usage

    import { PureComponent } from 'react';
    import { RouteComponentProps, withRouter } from 'react-router-class-tools';
    
    export default withRouter(
        class RoutePage extends PureComponent<
            RouteComponentProps<{ id: string }, {}, { extra: number }>
        > {
            render() {
                const { id } = this.props.match.params,
                    { extra } = this.props.query;
    
                return (
                    <ul>
                        <li>ID: {id}</li>
                        <li>extra: {extra}</li>
                    </ul>
                );
            }
        }
    );

    Reference

    1. https://github.com/remix-run/react-router/issues/8146
    2. https://segmentfault.com/a/1190000041700003

    User case

    1. https://github.com/idea2app/React-MobX-Bootstrap-ts
    2. https://github.com/idea2app/React-MobX-Ant-Design-ts

    Install

    npm i react-router-class-tools

    DownloadsWeekly Downloads

    71

    Version

    0.1.2

    License

    LGPL-3.0

    Unpacked Size

    14.9 kB

    Total Files

    13

    Last publish

    Collaborators

    • tech_query