Chrome 扩展程序中的分组上下文菜单项

Question

我有以下数据结构（样本）：

Folder1
  - Folder2
    - Snip1
    - Snip2
  - Folder3
    - Snip3
  - Snip4
  - Folder4
    - Snip5

^{文件夹相互嵌套没有限制}

我需要允许用户在他/她右键单击文本区域时插入特定的片段。现在，我可以将上述数据展平为：

- Snip1
- Snip2
- Snip3
- Snip4
- Snip5

简单地创建上下文菜单条目。但是，我想要更好的用户体验，所以我更喜欢以下内容：

模拟实际数据中的文件夹结构。

问题：是否可以通过 Chrome 扩展生成这种类型的上下文菜单项的结构？

我查看了文档，但没有发现任何有用的信息。

更新：对于任何对代码感兴趣的人，这里是：

// this is the top most folder
this.createCtxMenuEntry = function(parentId){
    this.list.forEach(function(object, index){
        var id = chrome.contextMenus.create({
            contexts: ["editable"],
            id: // generateUniqueIDYourself
            title: object.name,
            parentId: parentId
        });

        if(object is folder) object.createCtxMenuEntry(id);
    });
};

诀窍是使用该parentId属性。

Answer 1

是的，可以使用 chrome 扩展动态创建（基于用户数据和更改）嵌套上下文菜单
我使用V7 Notes扩展创建了完全相同的内容（在文本字段中插入注释）
示例：

首先你需要创建主项目，然后递归地（我猜你有文件夹结构）创建附加到该主项目的子文件夹

var OriginalArrayData = [....]; //or whatever you have

chrome.contextMenus.create({
    title : "MAIN title",
    id: "main_ID", //call it whatever you like, but it needs to be unique
    type : "normal",
    contexts : ["editable"],
},function() {
    buildTree(OriginalArrayData, 'main_ID'); //pass original array and main_ID in first call
});

function buildTree(a, b) {
    for (var i=0, l=a.length; i<l; i++) { //loop trough passed data
        var notId = a[i].id, //create random unique ID for new items, I'm using id's from my notes
        notText = a[i].text; //create item title, I'm using text from my notes

        chrome.contextMenus.create({ //create CTX item
            id: notId,//for ID use previously created
            parentId: b,//for parent ID use second passed argument in function
            title: notText,//for title use previously creted text (or whatever)
            type: "normal",
            contexts: ["editable"]
        });
        if (a[i].list) buildTree(a[i].list, notId);//if folder, recursively call the same function
    }
}

在最后一行，每当您的循环运行到一个文件夹中时，您都需要调用您的buildTree函数，但是这次您需要从该文件夹中传递数据/数组，以及该文件夹 ID，以便它可以用作父 ID 以进一步孩子们

当函数完成遍历低谷子文件夹时，它返回上一步进入这些子循环的位置

所以，总结一下：
- 创建主要项目
- 在回调中创建递归函数来循环所有数据并将这些新项目创建/附加到主要项目
- 如果您有文件夹，该文件夹现在成为主要项目，并且它的所有子项都将被追加到它......等等
- 这样上下文菜单将尽可能深地遵循数据的文件夹结构

我认为这是在上下文菜单上创建动态文件夹结构的最简单和最轻松的方法
当某些数据发生变化时，您需要清理上下文菜单并重新创建它...（或者如果您知道要定位到哪个目标，则更新它）