如何在react-select v2中创建optgroup？

问题描述

我希望在我的反应选择列表中有optgroups，但似乎没有在任何地方记录。我有以下结构，我从：

I want to have optgroups in my react-select list, but it doesn't seem to be documented anywhere. I have the following structure, which I pulled from a comment in https://github.com/JedWatson/react-select/issues/59:

render() {
  const options = [
    {
      label: "Group 1",
      children: [
        { 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} />
}

我希望Group 1成为一个optgroup，选项1和2作为孩子。相反，组1只是作为常规选项出现。有没有人知道组1中的正确密钥是什么，把它变成一个optgroup？

I expect "Group 1" to be an optgroup, with options 1 and 2 as children. Instead, "Group 1" just appears as a regular option. Does anyone know what the correct key is, within "Group 1", to turn it into an optgroup?

我已经尝试过儿童和价值 ，但没有效果。

I've already tried "children", and "values", but to no effect.

推荐答案

选项是神奇的关键：

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} />
}

这会呈现我期望的方式。

This renders the way that I expect.

这篇关于如何在react-select v2中创建optgroup？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！