Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/elixir/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在react select v2中创建optgroup?_Javascript_Reactjs_React Select - Fatal编程技术网

Javascript 如何在react select v2中创建optgroup?

Javascript 如何在react select v2中创建optgroup?,javascript,reactjs,react-select,Javascript,Reactjs,React Select,我想在我的react select列表中包含optgroup,但似乎在任何地方都没有文档记录。我有以下结构,这是我从中的一条评论中得出的: render(){ 常量选项=[ { 标签:“第1组”, 儿童:[ {标签:“组1,选项1”,值:“值1”}, {标签:“组1,选项2”,值:“值2”} ] }, {label:“根选项”,value:“value_3”}, {label:“另一个根选项”,value:“value_4”} ]; 返回 } 我希望“group1”是一个optgroup,选项

我想在我的react select列表中包含optgroup,但似乎在任何地方都没有文档记录。我有以下结构,这是我从中的一条评论中得出的:

render(){
常量选项=[
{
标签:“第1组”,
儿童:[
{标签:“组1,选项1”,值:“值1”},
{标签:“组1,选项2”,值:“值2”}
]
},
{label:“根选项”,value:“value_3”},
{label:“另一个根选项”,value:“value_4”}
];
返回
}
我希望“group1”是一个optgroup,选项1和选项2都是子选项。相反,“组1”只是作为常规选项出现。有人知道在“组1”中,将其转换为optgroup的正确键是什么吗


我已经尝试过“儿童”和“价值观”,但没有效果。

选项是关键:

render() {
  const options = [
    {
      label: "Group 1",
      options: [
        { label: "Group 1, option 1", value: "value_1" },
        { label: "Group 1, option 2", value: "value_2" }
      ]
    },
    { label: "A root option", value: "value_3" },
    { label: "Another root option", value: "value_4" }
  ];
  return <Select options={options} />
}
render(){
常量选项=[
{
标签:“第1组”,
选项:[
{标签:“组1,选项1”,值:“值1”},
{标签:“组1,选项2”,值:“值2”}
]
},
{label:“根选项”,value:“value_3”},
{label:“另一个根选项”,value:“value_4”}
];
返回
}

这呈现了我期望的方式。

它实际上记录在GroupType下。根据我在OP评论中链接的文档,这仍然有效;是否有一个特定的东西不起作用?我如何才能得到所选的组标签和所选选项的标签和值?我的意思是说,如果我选择组1,选项,我如何才能得到“组1”1@Kalyan如果您的代码为select分类了项目,我认为您可以很容易地检测到项目属于哪个组,在react select的上下文之外。无论如何,如果你仍然有困难,你应该总是问一个新问题。
render() {
  const options = [
    {
      label: "Group 1",
      options: [
        { label: "Group 1, option 1", value: "value_1" },
        { label: "Group 1, option 2", value: "value_2" }
      ]
    },
    { label: "A root option", value: "value_3" },
    { label: "Another root option", value: "value_4" }
  ];
  return <Select options={options} />
}