我收到错误消息：```TypeError: Object(...) is not a function``` in my react app- 第一次尝试使用钩子

Question

我遇到了TypeError: Object(...) is not a function在我的代码中。 我尝试添加分号，但这没有帮助。 这是我的相关代码：

import { connect, useEffect } from "react";
import { fetchMenuItems } from "../../actions/index";
import MenuItem from "../shared/MenuItem";


const MenuItemsSelection = (props) => {
  useEffect(fetchMenuItems, []);

  const menuItems = props.menuItems.map((menuItem) => {
    return (
      <MenuItem menuItem={menuItem} />
    );
  });

  return (
    <p>{menuItems}</p>
  );
};

const mapStateToProps = (state) => {
  return {
    menuItems: state.menuItems
  };
};

export default connect(mapStateToProps)(MenuItemsSelection);

这是我的详细错误：

TypeError: Object(...) is not a function
Module.<anonymous>
src/components/Home/MenuItemsSelection.js:26
  23 |   };
  24 | };
  25 | 
> 26 | export default connect(mapStateToProps)(MenuItemsSelection);
  27 | 
View compiled
Module../src/components/Home/MenuItemsSelection.js
http://localhost:3000/static/js/main.chunk.js:541:30
__webpack_require__
/home/jade/code/personal/final-project-flatiron-frontend/webpack/bootstrap:856
  853 | 
  854 | __webpack_require__.$Refresh$.init();
  855 | try {
> 856 |     modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
      | ^  857 | } finally {
  858 |     __webpack_require__.$Refresh$.cleanup(moduleId);
  859 | }
View compiled
fn
/home/jade/code/personal/final-project-flatiron-frontend/webpack/bootstrap:150
  147 |         );
  148 |         hotCurrentParents = [];
  149 |     }
> 150 |     return __webpack_require__(request);
      | ^  151 | };
  152 | var ObjectFactory = function ObjectFactory(name) {
  153 |     return {
View compiled
▶ 2 stack frames were collapsed.
__webpack_require__

我真的很困惑，我刚刚被介绍过 react hooks 和 redux，所以我真的不知道我在做什么。 我也在使用 thunk，虽然我还没有走那么远。 如果需要更多信息，请在评论中告诉我。

Answer 1

您需要从 react-redux 导入连接。

import {connect} from 'react-redux';

您也不能直接在 useEffect 中使用 fetchMenuItems。

您需要将其用作 props.fetchMenuItems 或对其进行解构。

export default connect(mapStateToProps,{fetchMenuItems})(MenuItemsSelection);