Question

我是React的新手。如果我的函数名以大写开头（例如“ ErrorHandler”），则不能在返回函数内使用钩子。但是，如果我的函数名称以小写开头（例如“ errorHandler”），则一切正常。谁能解释为什么会这样？

const ErrorHandler = () => {
return props => {
  const [error, setError] = useState(null);
  return (
     <div>
        <Modal />
     </div>
  )
   }}

export default ErrorHandler

Answer 1

这里出现问题的原因是，React使用命名约定来确定函数是组件，自定义钩子还是常规函数或HOC（如果在代码中使用了钩子）

如果名称以大写字母开头，则react会假设该函数是组件，因此将针对该钩子规则进行验证。由于该钩子并不直接位于函数内，因此抛出错误

如果您使用小写的第一个字符，则react会将其假定为常规函数或HOC，因此根据该规则，返回的函数将成为组件，并且不违反钩子规则。

所有验证都需要设置一些基本规则，而这些规则是由react设置的

在返回函数中使用钩子

1 个答案: