Reactjs 缺少依赖项 constHandletestDelete=（id:any）=>{ 删除测试（id）。然后（（）=>{ queryClient.invalidateQueries（“测试”）； }); }; const columns=useMoom( () => [ {字段：“id”，标题名：“id”，宽度：80}， { 字段：“”， 宽度：120， disableClickEventBubbling:true， 可排序：false， disableColumnMenu:true， renderCell：（单元格：任意）=>( handleTestDelete（cell.id）} > history.push（`/something/${cell.id}/details`）} > ), }, ], [历史]

我收到了这个警告

React Hook UseMoom缺少依赖项：“handleTestDelete”。请包含它或删除依赖项数组

因为我没有在dependencies中添加单击delete按钮调用的函数…为什么要将其作为dependency？我甚至不确定将history作为dependency是否正确；我认为当时间顺序发生变化时，不需要重新计算列

我错了

---

谢谢

如果您使用的是

usemo

，您应该满足以下建议的依赖关系：

在这里，您可能还有一个选项：从

usemo

的依赖项中删除

handleTestDelete

，并在

usemo

中定义

handleTestDelete

函数；然后返回已记忆的列

注意：由于我没有看到完整的代码，我建议您测试此代码，并确保正确打印

usemo

中的日志1（仅打印一次）

---

类似职位：

---

谢谢，删除了图像。我可以像在UseMoom中那样检查useCallback评估吗？你的意思是-编写类似于

console.log（“recreating function handleTestDelete”）

的日志吗？是的。我也会对此进行测试。我想ESLINT会抱怨缺少

queryClient

（可能，它来自react查询的上下文）only.mmm否，这将记录在函数调用中…useCallback将要记忆的函数作为参数，因此不知道是否可以记录useCallback求值：（是的，我现在明白了。使用

useEffect（（）=>{console.log（“函数handleTestDelete已更改或重新创建”）；}，[handleTestDelete]）

在重新创建函数时查看日志。您需要确保没有不必要地重新创建它。是的，这可能是检查渲染的一个很好的解决方法。谢谢

  const handleTestDelete = (id: any) => {
    deleteTest(id).then(() => {
      queryClient.invalidateQueries("test");
    });
  };

  const columns = useMemo(
    () => [
      { field: "id", headerName: "ID", width: 80 },
      {
        field: "",
        width: 120,
        disableClickEventBubbling: true,
        sortable: false,
        disableColumnMenu: true,
        renderCell: (cell: any) => (
          <>
            <IconButton
              aria-label="delete"
              onClick={() => handleTestDelete(cell.id)}
            >
              <DeleteIcon fontSize="small" />
            </IconButton>
            <IconButton
              aria-label="view"
              onClick={() => history.push(`/something/${cell.id}/details`)}
            >
              <VisibilityIcon fontSize="small" />
            </IconButton>
          </>
        ),
      },
    ],
    [history]

const history = useHistory()

const columns = useMemo(() => {
  console.log("define memoized columns") // Log 1
  return [
    { field: 'id', headerName: 'ID', width: 80 },
    {
      // ... code here
      renderCell: (cell: any) => (
        <>
          <IconButton
            aria-label="delete"
            onClick={() => handleTestDelete(cell.id)}
          >
            <DeleteIcon fontSize="small" />
          </IconButton>
          <IconButton
            aria-label="view"
            onClick={() => history.push(`/something/${cell.id}/details`)}
          >
            <VisibilityIcon fontSize="small" />
          </IconButton>
        </>
      ),
    },
  ]
}, [history, handleTestDelete])

const handleTestDelete = useCallback((id: any) => {
  deleteTest(id).then(() => {
    queryClient.invalidateQueries('test')
  })
}, []) // <---- Here, you need to add the dependencies as well (maybe queryClient)