reactjs - React JS Fluent ui onRenderTitle

Question

您好，我是 react 新手，必须使用流利的 ui

我正在尝试更改自定义选项标签

onRenderTitle={(选项) => ${options.name} (${options.roll_number})}

我的代码：

<Dropdown
  placeholder={"Select your School"}
  onChange={(event, val) => {
  if (val === null) {
  setSelectedSchool("")
  } else {                                                                       
  setSelectedSchool(val.key);
  }
   }}

  value={selectedcounty}

   options={getschool.filter(x => x.county === selectedcounty).map((school, key) => (
   {
     key: school.name, text: school.name
   }
    ))}
       onRenderTitle={(options) => `${options.name} (${options.roll_number})`}
/>

我越来越

我想要的结果：

标签： reactjsfluentui-react

Answer 1

onRenderTitle是一个返回Elementnot的函数String。选项类型是IDropdownOption[]

<Dropdown
  ...
  onRenderTitle={options => <span>{options[0].key} ({options[0].text})</span>}
/>

代码笔示例。