请问如何用 hooks 实现一个定时保存的功能?

场景：用户在页面进行操作，每一分钟将用户的操作数据返给后端。

目前实现方式：util 文件写入一自动保存的 hooks ，接受‘保存函数 func()’为参数。hooks 内部用 useEffect 实现，依赖为空数组，进入页面产生一个定时器，60 秒调一次保存数据函数，且退出页面需要删除定时器。

export function useAutoSave(
  func: () => Promise<any>,
) {
  const timer = useRef<any>(-1);
  const d = duration || 60000;
  
  useEffect(() => {
    timer.current = setInterval(async () => {
     
        await func();
        showMessage(t("results saved automatically"));
    }, d);

    return () => {
      clearInterval(timer.current);
    };
  }, []);
}

场景复现情况：每 60 秒调一次保存函数。 问题：func 函数内部会将用户数据 result 传递给后端，但目前传递的都是空值。猜想是 result 没有做为 useEffect 的依赖，但如果放进 useEffect 依赖中肯定逻辑又不对了。

不知道该如何修改，求大家赐教。