有没有办法为语义 UI React Dropdown 提供 html“名称”属性

Question

对于普通的 html 元素，您可以通过表单获取该元素的值。 function handleSubmit(event) {    event.preventDefault()    const formData = new FormData(e.target)    console.log(formData.get("test"))    // logs the value of the html element with the name "test"  }<form onSubmit={handleSubmit}>    <input name="test" />    <button type="submit">Submit</button></form>表单将分配一个键“测试”表单提交时输入内容的值。我的问题：有没有办法让此功能与语义 UI 下拉菜单一起使用？下面是我认为可行的理想情况，但我知道不行，因为该组件是其他元素的包装器。 function handleSubmit(event) {    event.preventDefault()    const formData = new FormData(e.target)    console.log(formData.get("test"))    // logs the value of the html element with the name "test"  }<form onSubmit={handleSubmit}>    <Dropdown name="test" selection options={        [{key: '1', text: 'text', value: '1'}]      }/>    <button type="submit">Submit</button></form>提交表单时，在该下拉列表中选择的任何值都会放入 formData 中名为“test”的键中。如果未选择任何值，则为键“test”赋予未定义的值。这可能吗？我还有另一个使用基本 html 选择器的工作，但不想更改很多已经编写的代码。

Answer 1

是的，但您需要解构下拉组件。

const [open, setOpen] = useState(false)

<Dropdown

    trigger={<Button onClick={() => setOpen(true)}>Open</Button>}

    onClose={() => setOpen(false)}

    icon={null}

    open={open}

    simple

  >

    <Dropdown.Menu>

      ... add the options with the "name" tag ...

    </Dropdown.Menu>

  </Dropdown>