Question

我是Reactjs的新手，我已经尝试了一些解决方案，但在我的项目中不起作用。

我正在尝试从另一个组件内部调用其他组件，但是显示错误。

组件正在从另一个组件中调用：

import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import 'isomorphic-fetch';
import Griddle, { plugins } from 'griddle-react';


interface State {
    name?: string;
    ItemNo?: string;
    StockCode?: string;
    Description?: string;
    Quantity?: string;
    Tag?: string;
    PurchaseDescription?: string;
    Remark?: string;
    ddlQty?: string;
    ddlHazardClass?: string;
    ddlHazardMaterial?: string;

}
interface MyObj {
    shnh_approval_date: string
    shnh_approval_date_formatted: string
    po_number: string
}
export class LineitemDetailsComponent extends React.Component<RouteComponentProps<{}>> {
    public state: State;
    constructor() {
        super();
        this.state = { name: "" };
    }

    public render() {
        return (<div>

        </div>)
    }

}

正在调用另一个组件的主要组件

import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import 'isomorphic-fetch';
import Griddle, { plugins } from 'griddle-react';
import axios from 'axios'
import { LineitemListComponent } from '../components/LineitemListComponent';
import { LineitemDetailsComponent } from '../components/LineitemDetailsComponent';

interface State {
    name?: string;
    ddlPrefix?: string;
    ddlShipFrom?: string;
    ddlShipTo?: string;
    ddlNoticeType?: string;
    ddlStatus?: string;
    txtDesc?: string;
    isHovered?: boolean;
}


export class LineComponent extends React.Component<RouteComponentProps<{}>> {
    public state: State;
    constructor() {
        super();
        this.state = { name: "", ddlPrefix: "All", ddlShipFrom: "All", ddlShipTo: "All", ddlNoticeType: "All", ddlStatus: "All", txtDesc: "", isHovered: false  };

    }



    public render() {
        return (<div>           

                <div>
                    <LineitemDetailsComponent  />
                </div>
            </div>
        );
    }
}

route.tsx

import * as React from 'react';
import { Route } from 'react-router-dom';
import { Layout } from './components/Layout';
import { Home } from './components/Home';
import { HeaderComponent } from './components/HeaderComponent';
import { LineitemListComponent } from './components/LineitemListComponent';
import { LineitemDetailsComponent } from './components/LineitemDetailsComponent';
import { LineComponent } from './components/LineComponent';




export const routes = <Layout>
    <Route exact path='/' component={ Home } />
    <Route path='/HeaderComponent' component={HeaderComponent} />
    <Route path='/LineitemListComponent' component={LineitemListComponent} />
    <Route path='/LineitemDetailsComponent' component={LineitemDetailsComponent} />
    <Route path='/LineComponent' component={LineComponent} />

</Layout>;

在删除RouteComponentProps <{}>之后，路由器抛出错误。我真的不知道该怎么办。

类型“ {}”不能分配给类型“ Readonly <routecomponentprops <{} >>”

0 个答案: