Question

我在导出React类组件并将其在Enzyme中使用时遇到问题，因为它以函数类型的形式导出：

class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
...
}

export default connect(null, mapDispatchToProps)(MyComponent);
export const MyComponentRaw = MyComponent

然后，当我尝试在酶中使用它时：

import {MyComponentRaw} from "../../MyComponent";

const wrapper = shallow<typeof MyComponentRaw>(<MyComponentRaw />)

显示为function。

另一方面，当我直接导出组件时：

export default class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
...
}

我可以在酶中使用它

import MyComponentRaw from "../../MyComponent";

const wrapper = shallow<typeof MyComponentRaw>(<MyComponentRaw />)

Answer 1

您可以通过连接导出类组件和默认组件。

export class MyComponent extends React.Component {
}
export default connect(null, mapDispatchToProps)(MyComponent);

您可以在未测试的组件中导入

import {MyComponent} from '/the/location';

然后您可以使用导入导入的组件

import ConnectedMyComponent from '/the/location';

如何导出具有正确类型的React类组件

1 个答案: