Javascript 反应选择中的嵌套下拉列表

我正在使用react select渲染下拉列表。渲染下拉列表的选项如下所示

 [
    {   
        text:'Fruit',
        value:'mango'
        level: 0
    },
    {   
        text:'Seasonal',
        slug: 'saasonal',
        level: 1
    },
    {   
        text:'Orange',
        slug: 'orange',
        level: 2
    },
    {   
        text:'Mango',
        slug: 'mango',
        level: 2
    },
    {
        text: 'Winter',
        slug:'winter',
        level:1
    },
    {
        text: 'Plum',
        slug:'plum',
        level:2
    }

]

我希望下拉列表是这样的

Fruit   
    Seasonal
        Orange
        Mango
    Winter
        Plum

我已尝试将组添加到react select，但组标题无法单击。 我还提到了stackoverflow链接

[https://stackoverflow.com/questions/53119912/how-can-i-create-nested-option-groups-in-react-select-v2][1]
并尝试通过将我的选项作为数据传递到上面的链接上，以相同的方式创建递归下拉列表，但没有成功

---

嵌套内下拉列表的顺序是基于级别的。

react select实际上在7月份才内置了此功能

我不确定它是否已经进入主分支，但是如果示例代码与您使用的版本不兼容，您可以始终从上面示例中package.json文件中列出的版本中提取

编辑：如果您希望组标题可以单击，请将其删除。我不认为这是这次行动的一部分