Question

const [data, setData] = useState(undefined);
useEffect(() => {
    if (changeRequests.data) {
        setData(setDefaultState(changeRequests.data));
    }
}, [changeRequests.data, setData,setDefaultState ]);

const setDefaultState = data => {
    let names = getNameList(data);
    setSelectedItems(names);
}

'setDefaultState'函数使useEffect Hook（在第78行）的依赖性在每个渲染器上都改变。将其移至useEffect回调中。或者，将“ setDefaultState”定义包装到其自己的useCallback（）挂钩中

const [resultsFallback] = useState([]);
const getNameList = res => {
let jList = getJData(res);
let jNames = resultsFallback;
jNames = jList.map(j => {
    return `${j.joggers}`
});
return jNames;

}

“ getNameList”函数在每个渲染器上更改useCallback Hook的依赖项。要解决此问题，请将“ getNameList”定义包装到其自己的useCallback（）挂钩中

Answer 1

将您的setDefaultState声明更改为此：

const setDefaultState = useCallback((data) => {
  let names = getNameList(data);
  setSelectedItems(names);
}, [getNameList, setSelectedNames])

别忘了import React, { ..., useCallback } from 'react'

“ getNameList”函数在每个渲染器上更改useCallback Hook的依赖项。要解决此问题，请将“ getNameList”定义包装到其自己的useCallback（）挂钩中

Answer 2

对于错误1）：linter告诉您您依赖于可能更改的外部值，如果某些值在重新渲染之间没有变化，则可以告诉React跳过应用效果。不更改值，它将保持不变。 2）数据应在组件内部使用，这里您将其作为参数传递，数据应在JSX表达式内部，并且在重新渲染后它将更改值。

React Hook useEffect在reactjs useEffect中缺少依赖项

2 个答案: