将路由参数传递给组件

时间:2018-07-22 21:32:35

标签: javascript reactjs typescript routing tsx

我想在我的路由常量中添加一个组件:

export const routes = <Layout>
    <Route exact path='/' component={ Home } />
    <Route path='/counter' component={ Counter } />
    <Route path='/fetchdata' component={ FetchData } />
</Layout>;

组件计数器

import * as React from 'react';
import { RouteComponentProps } from 'react-router';

    interface CounterState {
        currentCount: number;
    }

        export class Counter extends React.Component<RouteComponentProps<{}>, CounterState> {
            constructor(props: RouteComponentProps<{}>) {
                super(props);
                this.state = { currentCount: 0 };
            } 
        ....

所以我收到此错误消息:

  

[加载器]中的错误。/ClientApp/routes.tsx:10:28       TS2326:属性“ component”的类型不兼容。     类型'typeof Counter'不能分配给类型'StatelessComponent |未定义> | ComponentClass |未定义>。         参数“ props”和“ props”的类型不兼容。           输入“ RouteComponentProps | “未定义”无法分配给“ RouteComponentProps <{}>”类型。             不能将类型'undefined'分配给类型'RouteComponentProps <{}>'。

那我该如何解决这个问题?

0 个答案:

没有答案