[英]React Hook useMemo has missing dependencies
How to handle this warning?如何处理这个警告? (React Hook useMemo has missing dependencies: 'deleteTutorial' and 'openTutorial'. Either include them or remove the dependency array react-hooks/exhaustive-deps) If I put openTutorial and deleteTutorial inside useMemo hook, there wont be compile warning, but then I have a problem that those two functions wont work. (React Hook useMemo 缺少依赖项:'deleteTutorial' 和 'openTutorial'。要么包含它们,要么删除依赖项数组 react-hooks/exhaustive-deps)如果我将 openTutorial 和 deleteTutorial 放在 useMemo 钩子中,则不会出现编译警告,但随后我有一个问题,这两个功能不起作用。
const openTutorial = (rowIndex) => {
const id = tutorialsRef.current[rowIndex].id;
props.history.push("/tutorials/" + id);
};
const deleteTutorial = (rowIndex) => {
const id = tutorialsRef.current[rowIndex].id;
TutorialDataService.remove(id).then((response) => {
props.history.push("/tutorials");
let newTutorials = [...tutorialsRef.current];
newTutorials.splice(rowIndex, 1);
setTutorials(newTutorials);
}).catch((e) => {
console.log(e);
});
};
const columns = useMemo(() => [
{
Header: "Naziv",
accessor: "title"
}, {
Header: "Opis",
accessor: "description"
}, {
Header: "Površina",
accessor: "povrsina"
}, {
Header: "Dužina x Širina",
accessor: properties => properties.duzina + ' x ' + properties.sirina
}, {
Header: "",
accessor: "actions",
Cell: (props) => {
const rowIdx = props.row.id;
return (<div>
<span onClick={() => openTutorial(rowIdx)}>
<i className="far fa-edit action mr-2"></i>
</span>
<span onClick={() => (confirmDialog('Da li želite obrisati parcelu?', () => deleteTutorial(rowIdx)))
}>
<i className="fas fa-trash action"></i>
</span>
</div>);
}
}
], []);
/ EDIT / Now I have problem that useCallback has missing dependency props.history. /编辑/ 现在我遇到了 useCallback 缺少依赖 props.history 的问题。 Is it ok to fix it like this:可以这样修复吗:
const callHistory = useCallback(() => {
props.history.push("/tutorials");
}, [props.history]);
const deleteTutorial = useCallback((rowIndex) => {
const id = tutorialsRef.current[rowIndex].id;
TutorialDataService.remove(id).then((response) => {
callHistory();
let newTutorials = [...tutorialsRef.current];
newTutorials.splice(rowIndex, 1);
setTutorials(newTutorials);
}).catch((e) => {
console.log(e);
});
}, [callHistory]);
Let me explain, when I make it like this:让我解释一下,当我这样做时:
const openTutorial = useCallback((rowIndex) => {
const id = tutorialsRef.current[rowIndex].id;
props.history.push("/tutorials/" + id);
}, []);
const deleteTutorial = useCallback((rowIndex) => {
const id = tutorialsRef.current[rowIndex].id;
TutorialDataService.remove(id).then((response) => {
props.history.push("/tutorials");
let newTutorials = [...tutorialsRef.current];
newTutorials.splice(rowIndex, 1);
setTutorials(newTutorials);
}).catch((e) => {
console.log(e);
});
}, []);
const columns = useMemo(() => [
{
Header: "Naziv",
accessor: "title"
}, {
Header: "Opis",
accessor: "description"
}, {
Header: "Površina",
accessor: "povrsina"
}, {
Header: "Dužina x Širina",
accessor: properties => properties.duzina + ' x ' + properties.sirina
}, {
Header: "",
accessor: "actions",
Cell: (props) => {
const rowIdx = props.row.id;
return (<div>
<span onClick={() => openTutorial(rowIdx)}>
<i className="far fa-edit action mr-2"></i>
</span>
<span onClick={() => (confirmDialog('Da li želite obrisati parcelu?', () => deleteTutorial(rowIdx)))
}>
<i className="fas fa-trash action"></i>
</span>
</div>);
}
}
], [deleteTutorial, openTutorial]);
i get this warning: React Hook useCallback has a missing dependency: 'props.history'.我收到此警告: React Hook useCallback 缺少依赖项:'props.history'。 Either include it or remove the dependency array react-hooks/exhaustive-deps包括它或删除依赖数组 react-hooks/exhaustive-deps
So I am wondering if it is ok to put props.history in dependency:所以我想知道是否可以将 props.history 放在依赖中:
const openTutorial = useCallback((rowIndex) => {
const id = tutorialsRef.current[rowIndex].id;
props.history.push("/tutorials/" + id);
}, [props.history]);
@moderator: sorry, I dont know how to put code in comment, so I answered my question, but I think this is really answer to my question :) @moderator:抱歉,我不知道如何在评论中添加代码,所以我回答了我的问题,但我认为这确实是对我问题的回答:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.