React Redux 导出默认有 2 个函数

Question

我是 React 的新手，所以如果这是一个愚蠢的问题请原谅我，但我坚持以下几点：

目前我有这个：

export default connect()(PrechatForm);

现在我想用 react-i18next 翻译 render 函数中的一些文本。他们的向导说我必须这样做：

export default translate()(PrechatForm);

但由于连接功能已经存在，我不确定如何将它们结合起来。最后我想它应该看起来像这样：（这当然不是有效的 JS）

export default connect(PrechatForm)()translate()(PrechatForm);

整个示例如下所示：

import { connect } from 'react-redux'
import { translate } from 'react-i18next';

class PrechatForm extends Component {
  constructor(props) {
    super(props);
  }
  render() {
  const { t } = this.props;
    return (
      {t.('translateme')}
    );
  }
}

export default connect()(PrechatForm);

Answer 1

直接的解决方案是使用

export default translate()(connect()(PrechatForm));

即首先连接到 Redux，然后翻译连接的组件。

编辑：为了帮助形象化，您可以这样看

const connector = connect();
const translator = translate();

export default translator(connector(PrechatForm));

React Redux 导出默认有 2 个函数

React Redux export default with 2 functions

reactjs

redux

react-redux