[英]React Hook useEffect/useCallback has a missing dependency
I have this warning in my ProductUpdate.js file.我的 ProductUpdate.js 文件中有此警告。
My code looks like this:我的代码如下所示:
const fetchProduct = () => {
getProduct(slug)
.then(p => setValues({...values, ...p.data }))
}
useEffect(() => {
fetchProduct()
fetchCategories()
}, [])
The warning says:警告说:
React Hook useEffect has a missing dependency: 'fetchProduct'. React Hook useEffect 缺少依赖项:'fetchProduct'。 Either include it or remove the dependency array
包括它或删除依赖数组
But when I add fetchProduct to dependency array I enter infinite loop.但是当我将 fetchProduct 添加到依赖数组时,我进入了无限循环。
I have tried useCallback hook:我试过 useCallback 钩子:
const fetchProduct = useCallback(() => {
getProduct(slug)
.then(p => setValues({...values, ...p.data }))
}, [])
useEffect(() => {
fetchProduct()
fetchCategories()
}, [fetchProduct])
But then the warning says to add slug and values dependencies to useCallback.但是随后警告说要向 useCallback 添加 slug 和 values 依赖项。 When I do I enter infinite loop again.
当我这样做时,我再次进入无限循环。
Any solution?有什么解决办法吗?
Adding getProduct
, slug
, and setValues
to the callback dependency array should work:将
getProduct
、 slug
和setValues
添加到回调依赖数组应该可以:
const fetchProduct = useCallback(() => {
getProduct(slug)
.then(p => setValues(values => ({ ...values, ...p.data })))
}, [getProduct, slug, setValues])
useEffect(() => {
fetchProduct()
fetchCategories()
}, [fetchProduct, fetchCategories])
Follow the same pattern for putting fetchCategories
in a useCallback
.按照相同的模式将
fetchCategories
放入useCallback
中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.