Reactjs “反应钩”；“使用状态”；在函数“中调用”；“设备状态”；它既不是反应功能组件，也不是自定义反应

我不熟悉react钩子和功能组件，我正在尝试在我的功能组件中使用useState，它会向我显示前面提到的错误

使用React、ant设计

import React, { useState } from 'react';
import 'antd/dist/antd.css';
import './device-status.css'

import { Checkbox, Switch } from "antd";

function deviceStatus() {

    const [isEnabled, setIsEnabled] = useState(false)

    const toggleSwitch = (checked) => {
        console.log(checked);

        setIsEnabled(checked)
    }
   return (
         <div className="devicestatus-item" >
              <span>Front Low Light :</span>
               <Switch checked={isEnabled} onChange={toggleSwitch} />
          </div>
    )
}
export default deviceStatus

import React，{useState}来自“React”；
导入“antd/dist/antd.css”；
导入“./device status.css”
从“antd”导入{Checkbox，Switch}；
函数设备状态（）{
const[isEnabled，setIsEnabled]=useState（false）
常量切换开关=（选中）=>{
控制台日志（选中）；
setIsEnabled（已选中）
}
返回(
前近光灯：
)
}
导出默认设备状态

参考文献

错误：

---

在函数“deviceStatus”中调用React钩子“UseStatus”，该函数既不是React函数组件，也不是自定义React钩子函数React钩子/钩子规则

此问题是由于React读取带有Pascal大小写的函数组件而引起的。因此，请尝试将函数和文件名更改为

DeviceStatus