首页 > 解决方案 > 流利的 UI 下拉需要未识别

问题描述

我在表单中使用了流畅的 UI 下拉菜单。下拉列表对我来说是必填字段。我使用了 Fluent UI 中的“必需下拉菜单”,但这不起作用。我试过这个

<Dropdown styles={{ title: {},dropdown: {}}} title="" placeholder={} onRenderLabel={} options={} onChange={} required={true} errorMessage={}/>

这也

<Dropdown styles={{ title: {},dropdown: {}}} title="" placeholder={} onRenderLabel={} options={} onChange={} required errorMessage={}/>但它们都不起作用。

有人可以帮我解决这个问题吗?

标签: reactjsfluentui-react

解决方案


我也面临同样的问题。添加 Required={true} 或 aria-required="true" 没有帮助。必填属性 - 只需添加一个星号以将其指示为必填字段,但在提交期间未验证。此属性在 TextField 等控件中按预期工作。

问题截图

我的代码:

render() {
    return (
      <div className='dropdownExample'>
        <form>
          <Dropdown required={true} aria-required="true" label='Required dropdown contrsl'
            options={
              [
                { key: 'A', text: 'Option a' },
                { key: 'B', text: 'Option b' },
                { key: 'C', text: 'Option c' },
                { key: 'D', text: 'Option d' },
                { key: 'E', text: 'Option e' },
                { key: 'F', text: 'Option f' },
                { key: 'G', text: 'Option g' },
              ]
            } />         
          <TextField label="Required textfield control" required={true} />
          <button type="submit">Submit</button>
        </form>
      </div>
    );
  }

推荐阅读