React 错误:Invalid hook call - 了解并修复 'useRef' 错误
The error message indicates that you are calling a React hook (useRef) outside of the body of a function component. \n\nIn your code, you are initializing `REF_MAP` using the `useRef` hook inside the `useEffect` hook, which is not allowed. Hooks can only be called at the top level of a function component or inside other custom hooks.\n\nTo fix the error, you should move the initialization of `REF_MAP` outside of the `useEffect` hook, like this:\n\njavascript\nconst REF_MAP = {}; // Move this line outside of the component\n\nconst VersionConfiguration: React.FC = () => {\n // ...\n\n const columns: ProColumns[] = [\n // ...\n ];\n\n useEffect(() => {\n const data = [\n {\n nodeVersion: '1',\n testingItem: '全功能用例测试',\n head: '张三',\n caseLibraryName: '222',\n },\n {\n nodeVersion: '2',\n testingItem: '全功能用例测试',\n head: '张三',\n caseLibraryName: '111',\n },\n ];\n // formRef.current?.setFieldsValue({\n // dataSource: data.map((item: any) => ({ key: getOnlyKey(), ...item })),\n // });\n\n // No need to initialize REF_MAP here\n\n }, []);\n\n DEMAND_DICT.forEach((item) => {\n REF_MAP[item.value] = useRef<ActionType>(null);\n });\n\n return (\n // ...\n );\n};\n\n\nBy moving the initialization of `REF_MAP` outside of the `useEffect` hook, you ensure that it is called at the top level of the component and avoid the "Invalid hook call" error.
原文地址: https://www.cveoy.top/t/topic/qfWy 著作权归作者所有。请勿转载和采集!