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

fluentui上有一个漂亮的基于模式的表单组件

但是他们没有提供任何方法/示例来收集我所知道的数据。（至少不在文档中）。我可以从事件中收集大多数值，onSubmit但它变得很棘手，因为并非所有 html 组件都必须是具有该value属性的输入元素。我也不认为这是预期的方式。任何人都可以启发我吗？我认为您必须能够以某种方式将 onChange 函数提供给它。还是我应该在每个字段对象中添加 onChange 函数？

Fluent UI React 的新手。

我一直在修改这个框架，并阅读了我能找到的所有文档。我的理解是在组件样式方面鼓励使用CSS-in-JS方法。我看到有两种方法可以做到这一点——通过stylesprop 和使用mergeStyleSets实用程序函数 + classNameprop。这是一个代码笔来说明我的意思。

我的问题是，它们服务于不同的用例还是几乎相同？我如何决定使用哪一个？谢谢。

我有兴趣在Blazor Webassembly 项目中使用 OfficeUI /Fluent UI中的控件。

如何添加这些项目，理想情况下，这样我就不需要依赖服务器运行时（并且可以使用 Azure Blob）来托管网站。

我希望聊天窗口在我发送文本时向下滚动。

实际上发送的消息不会触发滚动，所以它们是隐藏的。

这是一个示例（我正在使用 MS Fluent UI for React 库的聊天组件）

我找到了这篇文章，但我无法整合它（不知道在哪里声明了 endMessage ）在我的情况下它的价值是undefined.

I would make a dynamic tabs chat using fluent ui for react.

Actually I'm showing content using a conditional switch that return chat content depending on tab item clicked.

Here's the switch condition

In my chat component I set a state that I initialise with initial chat content ( should come from state) then I update every time I add a message.

Here's a demo of issue

My actual problem is that the chat content does not change when I select tab 2 or 3 (author name says at last tab selected after selecting tab 1 )

It does change content when I replace <Chat items={itemsChat} /> with <Chat items={items} />but in this case I'll not be able to add messages to chat (itemsChat represent items + new messages )

How can I make tabs updates chat content by keeping adding new messages to chat ?

参考拖放示例，有没有办法在移动发生之前在将要移动到的行上显示视觉指示器？这类似于重新排序列标题时显示的视觉指示器。如果完成移动，删除的行将移动到的行的上方或下方会显示一条线，让用户了解该行的位置。

在这里发帖是因为微软不想在他们的 GitHub 存储库问题中提出问题。

今天尝试使用fluent-ui的Grouped DetailsList。

我的期望：我需要声明一些组，比如说红色、蓝色、绿色，然后添加到每个项目，我想添加到列表中，一个特定的属性，将项目映射到组。例如：

我发现我必须做的事情：我需要对包含我的项目的数组进行排序，所有属于红色组的项目都需要放在一个块中。例如：[红、红、红、蓝、蓝、绿、绿、绿]。现在我需要提供有关 startIndex 和 count 的信息，以将我的项目数组映射到组。

这就是组的定义：

我不明白他们为什么这样做（对我来说这样很不方便）。所以，虽然我更多地介于 JS 的初学者和中级之间。我认为执行此操作的人是专业人士。一定是有原因的。也许它与性能有关？我可以想象，当涉及到非常大的列表时，这种方式会表现得更好，但我不确定。

有人知道这方面的一些细节并可以解释吗？

我正在使用 Microsoft FluentUI 库中的 MaskedTextField 组件。我试图从组件中获取未屏蔽的价值，但没有成功。我尝试了通过将值传递给道具的受控组件方法，以及通过将默认值传递给道具的不受控制的组件方法；并检查了 OnChange 事件处理程序中的组件属性，但我没有发现存储未屏蔽值的属性。

我做对了吗？有什么解决方法吗？

谢谢！

我正在尝试使用 React 在 Microsoft 的 Fluent UI 中增加所选 Pivot 项目链接上的行高。

为了澄清起见，这是一个屏幕截图：

橙色箭头指向我想增加高度的蓝线。

我曾尝试设置Pivot组件的样式属性，但到目前为止还没有成功。这是一些代码

我已经尝试了两者的不同属性，link但linkContent还没有找到方法。我相信我想要做的是操纵IStyle界面，但我找不到它的属性的详细信息。那里的链接非常模糊。例如， 、 等的所有可用属性是link什么linkContent？

对此的任何想法将不胜感激！

谢谢你。

我正在尝试使用 Microsoft 的 Fluent UI 使用 React 覆盖 Separator 组件的边距属性。上边距似乎默认为 15px，我希望它小于这个值。

这是一个屏幕截图：

上面的米色部分默认为 15px，我想缩小它，但我似乎找不到正确的 css 来这样做。

这是我到目前为止的代码：

我已经尝试将margin: 0它当前所在的位置放在根级别，并且也嵌套在下面，::before但都没有奏效。

我唯一的其他潜在线索来自对 Chrome DevTools 中样式的检查，结果如下：

任何想法都将不胜感激！

谢谢你的时间！