哈克：

Question

更新到react-addons-test-utils的最新.d.ts定义已经破坏了我们测试代码的编译。在这个功能中：

import * as TestUtils from 'react-addons-test-utils';
import MyReactComponent from 'blabla'

let buildComponent = () => {
    const root = TestUtils.renderIntoDocument(<MyReactComponent/>);
    return TestUtils.findRenderedComponentWithType(root, MyReactComponent);
}

将root传递给最后一个函数会导致error TS2345: Argument of type 'Component<any, {}> | Element | void' is not assignable to parameter of type 'Component<any, any>'.

很好，我可以演员：

let buildComponent = () => {
    const root = TestUtils.renderIntoDocument(<MyReactComponent/>);
    return TestUtils.findRenderedComponentWithType(root as React.Component<any, any>, MyReactComponent);
}

但现在在最后一行传递MyReactComponent会导致error TS2345: Argument of type 'typeof MyReactComponent' is not assignable to parameter of type 'ComponentClass<{}> & (new () => MyReactComponent) & (new () => { props: any; })'.

显然，它期望ClassType<any, T, C> C extends ComponentClass<{}> class MyReactComponent extends React.Component<IMyReactComponentProps, IMyReactComponentState>，而我的{{1}}不合适，但我不明白。

Answer 1

不能分配给'Component'类型的参数

这意味着root应为React.Component<any,any>类型。这意味着TestUtils.renderIntoDocument的签名可能是错误的。

哈克：

import * as TestUtils from 'react-addons-test-utils';
import MyReactComponent from 'blabla'

let buildComponent = () => {
    const root: React.Component<any, any> = TestUtils.renderIntoDocument(<MyReactComponent/>) as any;
    return TestUtils.findRenderedComponentWithType(root, MyReactComponent);
}

更多

注意需要使用any，因为返回值和期望的返回值之间没有简单的结构关系。有关详细信息，请参阅https://basarat.gitbooks.io/typescript/content/docs/types/type-assertion.html。

Answer 2

有同样的问题，有帮助：

TestUtils.findRenderedComponentWithType(root as React.Component<any, any>, MyReactComponent as any);

Answer 3

鉴于React和定义文件的突破性变化和流动性，我们可以通过在明确类型的帮助程序下抽象使用第三方方法，给它一些帮助（并且可能简化对未来更改的修复）。我们失去了一些＆＃34;灵活性＆＃34;在当前的定义中，但是如果我们知道<{1}}的返回类型和renderIntoDocument的参数类型（例如），我们可以像这样定义包装器：

findRenderedComponentWithType

使用react-addons-test-utils的新编译错误

3 个答案:

哈克：

更多