如何在React中获取office-ui-fabric-React/lib/下拉键的值

Question

我已经使用office-ui-fabric- app /lib/下拉在我的app应用程序中创建了下拉列表。

const fundsTypes: IDropdownOption[] =
    [
        { key: "Electronic", text: "Electronic" },
        { key: "BankCheque", text: "Bank Cheque" },
        { key: "TrustCheque", text: "Trust Cheque" },
        { key: "PersonalCheque", text: "Personal Cheque" }
    ];

<div className="ms-Grid-col ms-sm4">
  <Dropdown
     placeholder='Select Funds Type'
     data-cy='funds_type_input'
     options={fundsTypes}
     defaultSelectedKey={updatedState['fundType']}
     onChange={(ev, newItem) => this.props.updateValue(newItem!.key, 'fundType')}/>
  </div>

我将密钥存储在DB中，现在我希望根据页面上的某个键获得值，但我无法做到这一点。我在网上搜索了很多，但没有找到解决办法。

现在我想要的最后是，得到一个键的值。例如，如果我传递键"PersonalCheque“，那么值应该是个人支票。我试过fundsTypes"PersonalCheque“，但不起作用。

有人能帮忙吗？

Answer 1

在文档https://developer.microsoft.com/en-us/fluentui#/controls/web/dropdown中，我看到了selectedKeys道具

添加它时，必须将所选密钥存储在状态或某处。

 <Dropdown
     placeholder='Select Funds Type'
     data-cy='funds_type_input'
     options={fundsTypes}
     defaultSelectedKey={updatedState['fundType']}
     onChange={(ev, newItem) => this.props.updateValue(newItem!.key, 'fundType')}
     selectedKeys={["PersonalCheque"]} // here will be value from your state
/>