Question

我正在尝试使用react挂钩导出正常的功能组件，但出现此错误。

TypeError：Object（...）不是函数

当我删除钩子并在没有任何状态的情况下将其导出时。导出与Class组件相同的代码也可以。

import React,{ useState } from 'react';

const  Mycomponent = () => {
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

export default Mycomponent;

这是我导入和使用功能组件的方式。

import Mycomponent from './mycomponet';
class MYClassComponent extends Component {
  render() {
    return (
      <Mycomponent />
    }
}

我正在使用react 16.6.3，并曾经使用create-react-app。

Answer 1

我正在使用React 16.6.3 ...

就是这个问题。钩子是在v16.8中添加的，因此代码中的useState是undefined。

（这是一次转储隐藏了您的错误的情况之一[如果需要支持较旧的环境，并不是您有很多选择。]。如果那是本机的import语句，那么它将失败出现一个有用的错误，指出React没有名为export的useState，但是当使用CJS或AMD版本的React时，您的代码会转换为执行var useState = React.useState;的操作，因此不会出错出来，它只是给你undefined-这不是函数。:-)）

reactjs TypeError：使用钩子时Object（...）不是函数

1 个答案: