在react功能组件中使用useEffect时出错

Question

我正在学习使用react钩子来管理状态，但我得到了一个错误，即第5:3行：react钩子“useffect”在函数“campot”中被调用，该函数既不是react函数组件，也不是自定义react钩子函数react钩子/钩子规则

这是我的密码

import React, {useEffect} from "react";
import classes from "./Cockpit.module.css";

const cockpit = (props) => {
  useEffect(() => {
    console.log('Cockpit js useEffect');

  });

  const assiginedClasses = [];
  let btnClass = "";
  if (props.showPersons) {
    btnClass = classes.Red;
  }

  if (props.persons.length <= 2) {
    assiginedClasses.push(classes.red);
  }

  if (props.persons.length <= 1) {
    assiginedClasses.push(classes.bold);
  }
  return (
    <div className={classes.Cockpit}>
      <h1>Hi I'm a React App</h1>
      <p className={assiginedClasses.join(" ")}>This is really Working!</p>
      <button className={btnClass} onClick={props.clicked}>
        Toggle Name
      </button>
    </div>
  );
};

export default cockpit;

Answer 1

我认为use效应钩子更像这样：

useEffect(() => {
  effect
  return () => {
    cleanup
  }
}, [input])

Answer 2

当使用useEffect挂钩时，您的主要功能名称应以大写字母useCockpoint开头，而不是Cockpoint

Answer 3

下线更改后删除错误解决。这个代码是工作。1. const驾驶舱=（道具）=

在第1行下方更换。康斯特驾驶舱=（道具）=