问题标签 [office-ui-fabric-react]

众所周知，在正常的下拉列表中，您可以使用 .onchange 获取它的值onChange={e => this.setState({ whatever: e.target.value })}。问题是，在 Fluent UI React 中，这不起作用，因为它有一个自定义值处理系统。在 Fluent UI 文档中，它说将 onChange 函数链接到：

我的项目必须是免费的，因为它以一种特殊的方式与另一个应用程序集成。有什么方法可以获取此下拉 onChange 的值而不是使用 Typescript？

谢谢！

我正在使用来自 office-ui-fabric-react 的 Nav 并使用此处的图标呈现导航栏https://docs.microsoft.com/en-us/javascript/api/office-ui-fabric-react/inavlink?view= office-ui-fabric-react-latest#icon。我的要求是在导航栏中呈现一些自定义图标。图标属性需要一个字符串，并且只能使用此处https://uifabricicons.azurewebsites.net/中的图标及其友好名称，

要求：需要在此处显示不属于列表的图标https://uifabricicons.azurewebsites.net/

我个人和很多客户都认为导航组件中带有嵌套项的链接的默认图标很奇怪。因此，我希望他们的外观和行为由此改变：

对此：

（在屏幕截图中，大小也不同，但这只是我拍摄它们的上下文。我只是想更改图标）。后者也被微软 OWA (Outlook Online) 使用，它也使用 Fluent UI React。我唯一能想到的（但效果不是很好）是使用样式隐藏默认 V 形并修改渲染链接onRenderLink以显示其他 V 形。

我知道这个问题，但是通过样式更改图标是没有选择的，我想流利的 ui 不再是首选方式。

我有没有更好或官方的方式？

我有一个按钮，如下例所示，带有一个图标 (addFriendIcon)。

https://developer.microsoft.com/en-us/fluentui#/controls/web/button

如何为该图标添加样式？例如改变颜色？

从'react'导入*作为React；从“office-ui-fabric-react”导入 { ActionButton, IIconProps }；

const addFriendIcon: IIconProps = { iconName: 'AddFriend' };

导出 const ButtonActionExample: React.FunctionComponent = props => {

返回（创建帐户）；};

如何在挂载时将 DetailsList 的列设置为特定宽度？

我想在每次保存时保存列宽，并在重新安装组件时恢复它们，即重新访问列表所在的视图。

如果我键入12345并将光标设置在 3 和 4 之间并开始键入，这将覆盖 4 和 5。我想要的是能够例如。在两者之间添加 77 ，输出将是：123 774 5. 有什么办法可以做到这一点吗？

我的代码基本上只是：

密码沙盒： https ://codesandbox.io/s/keen-sunset-khegc ?file=/src/App.js

我正在使用NormalPeoplePicker来自office-ui-fabric-react. 我覆盖onRenderItem了事件，但它破坏了 Persona 风格。我提供了两张图片和我的代码，感谢您的解决方案。

原创风格：

我更改后的样式：

使用 Fluent UI React，我在 TextField 中显示来自 AppSync API 的一些数据。我希望能够从 API 中显示联系表单的文本。然后我想编辑该文本并单击一个按钮将其发布回 AppSync API。

如果我自己使用 TextField 组件，我可以使用挂钩将变量设置为 AppSync API 调用的结果，然后让 TextField 组件读取来自我使用挂钩设置的变量的值。然后，我可以根据自己的喜好编辑该文本，并且很好。

我遇到的问题是，如果我想对 TextField 进行编辑并使用我的钩子设置它们，我就会失去对 TextField 的关注。为此，我使用了 TextField 的 onChange 属性。我可以很好地设置变量，但我必须继续点击返回输入窗口。

关于如何保持专注的任何想法？

编辑

我已更改 handleChange 函数以使用 prevItem。对于此事件，它确实接受事件和值。如果您记录该值，则它是当前值并且似乎有效。

尽管发生了变化，但我仍然看到失去焦点，这意味着我每次只能进行一键编辑。

网站上的示例显示了许多带有链接的导航栏示例。 导航栏演示的图像，如网站所示。

我想在这样的导航元素内实现一个搜索栏。有没有办法做到这一点？

如何在 Microsoft fluentui 库中创建“危险”（红色）按钮？就像在其他 ui 框架中一样，如 bootstrap 等。

有<DefaultButton>，<PrimaryButton>但我还没有找到类似的东西<DangerButton>？

或者，您如何指定样式以使按钮使用主题指定的“危险”颜色？