我应该在道具中使用哪种TypeScript类型来引用匹配对象？

小编典典

我应该在道具中使用哪种TypeScript类型来引用匹配对象？

reactjs

在我的React容器/组件中，我可以使用哪种类型来引用matchReact Router DOM包含的部分？

interface Props {
  match: any // <= What could I use here instead of any?
}

export class ProductContainer extends React.Component<Props> {
  // ...
}

阅读 274

2020-07-22

共1个答案

小编典典

您无需显式添加。您可以改用RouteComponentProps<P>from @types/react- router作为道具的基本接口。P是您的比赛参数的类型。

import { RouteComponentProps } from 'react-router';

// example route
<Route path="/products/:name" component={ProductContainer} />

interface MatchParams {
    name: string;
}

interface Props extends RouteComponentProps<MatchParams> {
}

// from typings
export interface RouteComponentProps<P> {
  match: match<P>;
  location: H.Location;
  history: H.History;
  staticContext?: any;
}

export interface match<P> {
  params: P;
  isExact: boolean;
  path: string;
  url: string;
}

2020-07-22