使用 redux 命名导出?

IT技术 reactjs redux react-redux
2021-05-18 15:51:21

我已经习惯使用命名导出,因为它使重构的工作更轻松。我刚刚开始实现 redux,但似乎我无法进行命名导出,因为连接需要映射组件。

所以例如

class Something extends Component { ... }

export default connect(mapStateToProps)(Something);

是否可以使用像“Something”这样的命名导出,我不能将导出放在类上,因为 react 继续工作 - 连接没有被导出,所以没有 redux 状态

有任何想法吗 ?

提前致谢

3个回答

只需将它分配给一个常量并像这样导出:

class Something extends Component { ... }

export const ConnectedSomething = connect(mapStateToProps)(Something);

然后你可以像这样导入它:

import { ConnectedSomething } from './....'

如果我理解正确,那么您可以通过命名导出导出您的“redux connected”组件,如下所示:

/*
Declare component class, with class name differing from named export
*/
class SomethingComponent extends Component { ... };

/*
Export redux connected HOC to external modules, via named export "Something"
*/
export const Something = connect(mapStateToProps)(SomethingComponent);

我建议使用 [文件夹]/index.ts:

export { default as SomethingComponent } from './SomethingComponent.tsx';

[文件夹]/SomethingComponent.tsx:

class SomethingComponent {}

export default SomethingComponent;

AnyComponent.tsx:

import { SomethingComponent } from '[folder]';