问题标签 [office-ui-fabric]

我有一个带有 3 个 PivotItems 的 Pivot 组件。

前 2 个仅显示标签。第三个显示表单输入文本。

查看显示我的问题的动画 gif

问题在于 Pivot 3。当我转到任何其他 Pivot，然后返回 Pivot 3 时，输入文本的值丢失。所以我猜每个 PivotItem 都在没有持久数据的情况下重新渲染。

这是正确的行为吗？有什么解决方法吗？

提前致谢，

我是 Office UI Fabric 的新手。默认情况下，Pivot 组件似乎没有响应。在小屏幕上处理 Pivot 组件的推荐方法是什么？我找不到任何包装功能。我试图弄清楚像 OverflowSet 和 ResizeGroup 这样的其他组件是否可以提供帮助。但是，它们似乎也不是 Pivot 的正确解决方案。欢迎任何建议。

我刚刚开始学习 React 并学习了一些入门教程，所以请原谅我的问题很愚蠢，或者使用的代码总体上很糟糕（不要犹豫让我知道），但是在谷歌搜索了很多之后，我似乎无法找到以下问题的答案：

我正在使用带有 JS 实现（而不是 TS）的 Fabric React。通过使用我在此处找到的示例，我成功集成了我的Nav组件：https ://developer.microsoft.com/en-us/fabric#/components/nav

遗憾的是，此示例错过了selected事件的实现（使所选项目用蓝色条突出显示），该示例只是将Nav组件的所选项目硬编码为 key: key1:

经过一些研究，我找到了添加更改选择的选定事件的完美示例，我在这里找到了：https ://codepen.io/dzearing/pen/ZBGNQg?editors=0010

我重写了它，以便可以在我的 JS 文件中使用它：

选定的事件对常规按钮工作正常，但由于某种原因，它不适用于Settings导航项目，它有自己的Links项目。任何线索为什么这对项目不起作用Settings？

我正在向 Microsoft Fabric DeatialsList 中的列添加一个输入框。我将它设置在 IColumn 定义的 onRender 中。一切正常，除了 tabIndex 总是-1。我想将其设置为 0。

有任何想法吗？

我已经使用微软在此处提供的 Typescript-React-Started 启动了 Microsoft Fabric-react 。

尽管此处提供了出色的 Fabric-react 文档，但我无法找到任何有关如何设置 fabric-react 组件样式的文档。

例如，Commandbar 组件的 Microsoft 文档可在此处获得。

默认主题以灰色和蓝色命令按钮呈现命令栏背景。

据我所知，微软提供了一个主题/样式系统。不幸的是，我找不到任何关于如何更改默认主题或创建自定义主题的从头到尾的示例。

所以，我的问题是：

1. 如何更改默认主题，并在 fabric-react 组件上应用特定主题？
2. 如何创建自定义主题？

我正在尝试为我的 Office Fabric React 编写测试，最初开始使用react-scripts-ts，现在因为遇到此问题而被弹出，并且在使用 withResponsiveMode 库时遇到以下错误：

我正在使用此处列出的 moduleNameMapper 设置：https ://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-6-Release-Notes 。

我的笑话配置如下：

tsconfig.json：

tsconfig.test.json：

我猜这是某种配置问题，因为此代码在未经测试时可以正常工作。

谁能告诉我如何过滤详细信息列表？例如，假设我有以下列表：

列表

如何过滤列表，以便当我键入“拒绝”时，它只会显示状态为“拒绝”的项目</p>

这是我尝试过的代码（来自文档https://developer.microsoft.com/en-us/fabric#/components/detailslist）：

谢谢！

如何设置 TextField 的最大宽度？默认情况下，宽度设置为最大尺寸

我用 Office-ui-fabric-react 创建了一个日期选择器。我已启用“allowTextInput”属性。我可以在 Chrome 中编辑文本输入，但在 IE 11 中不起作用。

观察到的行为：

Chrome：在键盘导航和鼠标点击中都可以正常工作。IE 11：在键盘导航中工作正常，但无法在鼠标单击时进行编辑。

我有一个组件，当鼠标悬停在“角色”元素上时，想要使用 Office-UI-Fabric-react 组件“标注”。
如果我引用包含“Persona”元素的“div”
（使用ref={this.setPersonaRef}），“标注”将起作用，
但componentRef={this.setPersonaRef}在“Persona”元素中会导致

CalloutContent.componentDidMount() 中的异常：TypeError：element.getBoundingClientRect 不是函数

这是组件：

我该如何解决异常？