javascript - 导出具有两个属性的 React 组件

Question

我正在使用 MaterialUI，我必须像这样导出我的组件:

import withStyles, { WithStyles } from "@material-ui/core/styles/withStyles";

...

export default withStyles(styles)(Users);

现在我开始使用i18next在我的项目中使用国际化，但它希望我像这样导出我的组件:

导出默认翻译(“common”)(用户);

问题是我怎样才能同时满足这两者？如何使用 withStyles 和 translate 导出？

感谢任何帮助

Answer 1

这两段代码都会生成一个新组件，因此您可以将其中一个的结果提供给另一个组件。一行完成，看起来像这样:

export default withStyles(styles)(translate("common")(Users));

或者，如果它更容易理解，这里将其分为两行。

const TranslatedUsers = translate("common")(Users);
export default withStyles(styles)(TranslatedUsers);