Question

我是React和Typescript的新手，所以我遇到了一个我不知道如何处理的问题。

我正在尝试将一个组件嵌入到另一个组件中，同时将一个参数从父项传递给子项，但我无法弄清楚这个错误告诉我的是什么。错误是：

Error TS2322 (TS) Type '{ test: 10; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<B> & Readonly<{ children?: ReactNode; }> & Readonl...'.
  Type '{ test: 10; }' is not assignable to type 'Readonly<RouteComponentProps<BProps>>'.
    Property 'match' is missing in type '{ test: 10; }'.

它说“只读”，但我没有看到只读来自哪里。

这是组件A，我想在其中嵌套组件B：

import * as React from 'react';
import { RouteComponentProps } from 'react-router-dom';
import B from './B';

export default class A extends React.Component<RouteComponentProps<{}>, {}> {
    public render() {
        return <B test={10} />;
    }
}

这是组件B.我在BProps中声明测试是一个数字，所以我认为它应该有效：

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

interface BProps { test: number }
interface BState {  }

export default class B extends React.Component<RouteComponentProps<BProps>, BState> {

    constructor(props: RouteComponentProps<BProps>) {
        super(props);
        this.state = {
            test: props.match.params.test
        };
    }

    public render() {
        return <h1>B</h1>;
    }
}

我正在使用Visual Studio 2017社区版。我开始使用React＆amp; Redux项目类型，只是添加了这两个组件来获取错误。我不认为其余的代码很重要，但我不完全确定。

将参数传递给嵌套组件会产生'错误TS2322类型不能分配给类型IntrinsicAttributes ...'

0 个答案: