chuckQu

摘要： 正文从这开始~ 总览 导致"Invalid hook call. Hooks can only be called inside the body of a function component"错误的有多种原因： react和react-dom的版本不匹配。 在一个项目中有多个react包版本。 阅读全文

摘要： 正文从这开始~ 总览 当我们尝试在类组件中使用useState 钩子时，会产生"React hook 'useState' cannot be called in a class component"错误。为了解决该错误，请将类组件转换为函数组件。因为钩子不能在类组件中使用。 这里有个例子用来展示错 阅读全文

摘要： 正文从这开始~ 总览 为了解决错误"React Hook 'useEffect' is called in function that is neither a React function component nor a custom React Hook function"，可以将函数名的第一个 阅读全文

摘要： 正文从这开始~ 总览 当我们有条件地使用useState钩子时，或者在一个可能有返回值的条件之后，会产生"React hook 'useState' is called conditionally"错误。为了解决该错误，将所有React钩子移到任何可能油返回值的条件之上。 这里有个例子用来展示错误是 阅读全文

摘要： 前言 CSS变量（官方称为自定义属性）是用户定义的值，它可以在你的代码库中设置一次并多次使用。它们使管理颜色、字体、大小和动画值变得更加容易，并确保整个web应用的一致性。 举个例子，你可以将品牌颜色设置为一个CSS属性（--primarycolor: #7232FA），并在任何使用品牌颜色的组件或 阅读全文

摘要： 正文从这开始~ 总览 当useEffect钩子使用了一个我们没有包含在其依赖数组中的变量或函数时，会产生"React Hook useEffect has a missing dependency"警告。为了解决该错误，禁用某一行的eslint规则，或者将变量移动到useEffect钩子内。 这里有 阅读全文

摘要： 正文从这开始~ 总览 当我们忘记从函数中返回值时，会产生"Expected an assignment or function call and instead saw an expression"错误。为了解决该错误，确保显式地使用return语句或使用箭头函数隐式返回。 下面有两个示例来展示错误 阅读全文

摘要： 正文从这开始~ 总览 当我们尝试使用默认导出来导出一个匿名函数时，会导致"Unexpected default export of anonymous function"警告。为了解决该错误，在导出函数之前，为函数赋予一个名称。 这里有个例子来展示警告是如何发生的。 // Header.js // 阅读全文

摘要： 正文从这开始~ 总览 当我们为元素的onClick属性传递一个值，但是该值却不是函数时，会产生"Expected onClick listener to be a function"报错。为了解决该报错，请确保只为元素的onClick属性传递函数。 这里有个例子来展示错误是如何发生的。 // App 阅读全文

摘要： 正文从这开始~ 总览 当我们尝试从函数组件中返回元素组成的数组时，会产生"Type '() => JSX.Element[]' is not assignable to type FunctionComponent"错误。为了解决该错误，可以将元素数组包裹在React片段中。 这里有个示例用来展示错 阅读全文