在 ReactJS 导出中组合多个对象答案

【问题标题】：Combining multiple Objects in ReactJS export在 ReactJS 导出中组合多个对象
【发布时间】：2019-07-09 11:07:03
【问题描述】：

所以我有一个使用 google-maps-react 包和 redux 的 React 组件

现在我需要将connect() 和GoogleApiWrapper 一起导出。我用谷歌搜索了一下，发现有人这样做：

export default connect(
  mapStateToProps,
  { saveMapCoords }
)(
  GoogleApiWrapper({
    apiKey: 'AIzaSyA5EqRGJ-YR-2ZCGxThhtFZKwNBy6wk73c'
  })
)(Maps)

Maps 是类名。

不幸的是，我收到了这个错误： TypeError: Object(...)(...)(...) is not a function

这是从GoogleApiWrapper 行返回的

有人知道为什么会这样吗？他们分开工作，但不一起工作

【问题讨论】：

看来你放错了一个括号：` export default connect( mapStateToProps, { saveMapCoords } )( GoogleApiWrapper({ apiKey: 'AIzaSyA5EqRGJ-YR-2ZCGxThhtFZKwNBy6wk73c' }) )(Maps)) `跨度>
这实际上和我上面写的一样，但最后多了一个括号，最后的括号给了我一个编译错误，说有一个不应该存在的括号.

标签： javascript reactjs redux google-maps-react

【解决方案1】：

你之前关闭了一个括号。 GoogleApiWrapper

GoogleApiWrapper({
  apiKey: (YOUR_GOOGLE_API_KEY_GOES_HERE)
})(MapContainer)

是一个 HOC，它将返回一个新组件，然后您将在 connect 中传递该组件。

试试这个

export default connect(
    mapStateToProps,
    { saveMapCoords }
)(
    GoogleApiWrapper({
        apiKey: "AIzaSyA5EqRGJ-YR-2ZCGxThhtFZKwNBy6wk73c"
    })(Maps)
)

【讨论】：

哦，我明白了，所以我离我想要的并不远。感谢您的纠正。
很高兴它有帮助:)