写运维脚本、提工单的时候经常要贴一个对象的完整 key(比如 bucket/logs/2026/07/app.log),以前只能打开详情栏、手动选中文字复制。这次在右键菜单加两条:复制对象名、复制完整路径。

就是 Clipboard API + 一个提示

功能本身很直接,包一个共用的复制函数,成功给个 toast、失败给个错误提示:

const copyToClipboard = async (text: string, okMsg: string) => {
  try {
    await navigator.clipboard.writeText(text);
    setNotice({ tone: "ok", text: okMsg });
  } catch (e) {
    setNotice({ tone: "err", text: String(e) });
  }
};

容易漏掉的地方:菜单入口不止一处

文件的右键菜单和文件夹的右键菜单是两份独立的菜单项数组(items/dirItems),两边都要各加一条"复制完整路径"(文件夹没有"文件名"意义上的复制,只加路径;文件两条都加)。这类"往已有菜单加一项"的功能,真正的工作量往往不是写这一项本身,而是找全所有需要加的入口——漏了文件夹那份菜单,功能就只对文件生效,用户不容易一下子意识到是哪半边漏了。

小结

没什么架构可讲,记一句踩过的坑就够:右键菜单这类"同一个功能在不同对象类型下有各自入口"的地方,改的时候要按类型清单核对一遍,别只改了最先想到的那一个。