如何修复useEffect的依赖项数组中存在的警告错误

Question

我想解决项目中的所有警告，但我不知道应该在依赖数组中包含哪些依赖项。下面我分享代码：

import React, { useState, useEffect } from 'react';
import { Redirect } from 'react-router-dom';
import Layout from '../components/Layout';
import { getPicture, getAlbums, updatePicture } from './ApiAdmin';
const UpdatePicture = ({ match }) => {
...
const init = (pictureId) => {
getPicture(pictureId).then(data => {
if (data.err) {
setValues({ ...values, err: data.err })
} else {
// populate the state
setValues({
...values,
name: data.name,
album: data.album._id,
formData: new FormData()
})
initAlbums()
}
})
}
const initAlbums = () => {
getAlbums().then(data => {
if (data.err) {
setValues({
...values,
error: data.err
});
} else {
setValues({
albums: data,
formData: new FormData()
});
}
});
}
const redirectUser = () => {
if (redirectToProfile) {
if (!error) {
return < Redirect to="/" />
}
}
}
useEffect(() => {
init(match.params.pictureId);
redirectUser(); // allows display the changes when a picture is updated
}, []);
...

}

这是一个警告：

React Hook useEffect缺少依赖项："init"、"match.params.pictureId"one_answers"redirectUser"。要么包括它们，要么删除依赖数组react hook/exhaust deps

我很感激谁能帮我。

Answer 1

请参阅此处的reactjs文档。从依赖项列表中省略函数是否安全？

Answer 2

只需将它们包含在依赖数组中

useEffect(() => {
init(match.params.pictureId);
redirectUser(); // allows display the changes when a picture is updated
}, [init, match.params.pictureId, redirectUser]);

这些都是当它们改变时应该调用useEffect的新运行的东西。我建议init和redirectUser函数使用useCallback，这样它们就不会在每次渲染时运行useEffect，除非它们发生更改(它们也将具有依赖数组！(。