如何在 fluent ui 中更改下拉列表中的边框颜色？

Question

<Dropdown/> 有样式道具。期望 IDropdownStyles。但无法更改边框轮廓颜色。我试过了，

root: {

    width: 300, color: "red", backgroundColor: "red", borderColor: "red",
    borderTopColor: "red",
    outlineColor: "red",
    borderRightColor: "red",


  },
  dropdown: {
    width: 300, color: "red", backgroundColor: "red", borderColor: "blue",
    borderTopColor: "red"
    , outlineColor: "red",
    borderRightColor: "red",
  },

但是没有反映颜色。还有其他方法可以实现吗？

Answer 1

在styles中使用title属性:

<Dropdown
  ...
  styles={{
    title: {
      borderColor: 'red',
    }
  }}
/>

Codepen 正在工作 example。