自定义节点开发
顶部菜单栏
顶部菜单栏 API 允许扩展为 ComfyUI 的顶部菜单栏添加自定义菜单项。这对于提供高级功能或不常用命令的访问非常有用。 基本用法 javascript app.registerExtension name: "MyExtension", // 定义命令 commands: id: "myCommand", label: "我的命令", function
顶部菜单栏 API 允许扩展为 ComfyUI 的顶部菜单栏添加自定义菜单项。这对于提供高级功能或不常用命令的访问非常有用。
基本用法
app.registerExtension({
name: "MyExtension",
// 定义命令
commands: [
{
id: "myCommand",
label: "我的命令",
function: () => { alert("命令已执行！"); }
}
],
// 将命令添加到菜单
menuCommands: [
{
path: ["扩展", "我的扩展"],
commands: ["myCommand"]
}
]
});命令定义方式与 命令与快捷键绑定 API 相同。详细定义命令请参见该页面。
命令配置
每个命令都需要 id、label 和 function：
{
id: string, // 命令的唯一标识符
label: string, // 命令显示名称
function: () => void // 命令被触发时执行的函数
}菜单配置
menuCommands 数组定义了命令在菜单结构中的位置：
{
path: string[], // 表示菜单层级的数组
commands: string[] // 要添加到该位置的命令 ID 数组
}path 数组指定菜单层级。例如，["文件", "导出"] 会将命令添加到"文件"菜单下的"导出"子菜单。
菜单示例
添加到已有菜单
app.registerExtension({
name: "MenuExamples",
commands: [
{
id: "saveAsImage",
label: "另存为图片",
function: () => {
// 保存画布为图片的代码
}
},
{
id: "exportWorkflow",
label: "导出工作流",
function: () => {
// 导出工作流的代码
}
}
],
menuCommands: [
// 添加到文件菜单
{
path: ["文件"],
commands: ["saveAsImage", "exportWorkflow"]
}
]
});创建子菜单结构
app.registerExtension({
name: "SubmenuExample",
commands: [
{
id: "option1",
label: "选项 1",
function: () => { console.log("选项 1"); }
},
{
id: "option2",
label: "选项 2",
function: () => { console.log("选项 2"); }
},
{
id: "suboption1",
label: "子选项 1",
function: () => { console.log("子选项 1"); }
}
],
menuCommands: [
// 创建嵌套菜单结构
{
path: ["扩展", "我的工具"],
commands: ["option1", "option2"]
},
{
path: ["扩展", "我的工具", "高级"],
commands: ["suboption1"]
}
]
});多个菜单位置
你可以将同一个命令添加到多个菜单位置：
app.registerExtension({
name: "MultiLocationExample",
commands: [
{
id: "helpCommand",
label: "获取帮助",
function: () => { window.open("https://docs.example.com", "_blank"); }
}
],
menuCommands: [
// 添加到帮助菜单
{
path: ["帮助"],
commands: ["helpCommand"]
},
// 也添加到扩展菜单
{
path: ["扩展"],
commands: ["helpCommand"]
}
]
});命令可以与其他 ComfyUI API（如设置）配合使用。关于设置 API 的更多信息，请参见 设置 API 文档。
官方原文
本页来自 Comfy-Org 官方中文文档的固定版本，并转换为 xueai 静态页面。内容以官方持续更新的页面为准。