首页 > 解决方案 > 我如何在反应钩子中使用这个 RouteComponentProps

问题描述

有RouteComponentProps

export interface RouteComponentProps<
    Params extends { [K in keyof Params]?: string } = {},
    C extends StaticContext = StaticContext,
    S = H.LocationState
> {
    history: H.History<S>;
    location: H.Location<S>;
    match: match<Params>;
    staticContext?: C;
}

使用状态我会做

class Example extends React.PureComponent<
  RouteComponentProps<{ id: string }>,
  State
>

我不确定如何将其转换为使用钩子

标签: reactjs

解决方案


下面是使用 React 钩子和react-router-dom包的例子。

import { useParams } from "react-router-dom"; 
    
//hook example
const Example = () => {
      const params = useParams(); //retreive params you need
      
      console.log(params) 
 
      return (
         <div>
          //...other code
        </div>
      );
}

export default App;


推荐阅读