问题标签 [fluent-ui]

我正在按照教程在 React 中使用 fluentui 构建仪表板，然后将对其进行自定义和更改。但是，我完全按照教程进行操作，没有出现任何错误，但由于某种原因，卡片和表格出现在屏幕底部，看起来不像它们的样式，并且表格中没有数据。

我的代码与此处的教程完全相同：https ://www.youtube.com/watch?v=P9s6dsdu_9c 。我将在下面发布一个屏幕截图，说明我的 atm 外观以及下面的所有相关代码。

代码：App.js

导航.js

Card.js

表.js

我目前正在尝试借助 FluentUI/react-northstar Dropdown 组件制作下拉菜单。不幸的是items，该组件的道具在下拉列表中只有一个string[]用于呈现名称的，但我也需要一个key。

我试图通过使用renderItem添加自定义渲染器来实现这一点：

该dropDownMapper函数返回一个对象数组，如下所示：[{key: string, name: string}, ...]

有了这个，我可以在我的下拉菜单中呈现正确的项目，但我无法与它们进行交互。我尝试添加onClickto <Component/>，但是由于我使用了框架，因此我不确定<Dropdown/>单击该项目时期望我做什么，并且文档并没有真正的帮助。

I am evaluating the new Microsoft fast.design https://www.fast.design/ with fluent-design-system-provider and trying to customize the accent color for Blazor project but no luck...

This is what I did so far as per the official documentation (https://www.fast.design/docs/design-systems/fast-frame):

In my asp.net core Blazor Server Project's _Host.cshtml

After this in my site.js I am trying to generate and replace the color pallete as mentioned in the documentation https://www.fast.design/docs/design-systems/fast-frame#generating-and-replacing-palettes

I get the following error, Uncaught TypeError: Failed to resolve module specifier "@microsoft/fast-colors". Relative references must start with either "/", "./", or "../".

How do i resolve this ?

我正在为 gatsby.js 使用 Microsoft 的 fluent ui starter kit。如果我使用 gatsby Link 组件，那么我不会得到 FluentUI 的样式。但是如果我使用 fluentui Link 组件，我不会得到 gatsby 链接组件的行为，它链接到 gatsby 站点内的其他页面。IE

我想用这个：

如果我使用这个，我会得到的样式：

如何使用 FluentUI Link 样式获得 gatsby 链接功能？

我必须使用 react-sortable-tree 进行拖放树视图。而且我还需要在我的树视图中进行 crud 操作。我已经在树视图上添加、编辑和删除到我的父节点。出乎意料的是，每当我拖动节点时，我都会遇到一些问题，那时我的第一个孩子将编辑并在之后正确更新，但无法使用删除功能，并且第 n 个孩子也无法正常添加、编辑和删除节点。

我的代码沙盒实时链接。

我正在尝试使用React-Final-Form构建一个简单的表单，如下所示：

TextInputNew组件是这样的：

然后我在使用这个NewUIForm组件时遇到了这个错误

错误：必须将渲染道具、渲染函数指定为子级或组件道具到 ReactFinalForm

顺便说一句，UI框架是Fluent-UI 有人能帮帮我吗？谢谢！！

我正在使用带有FluentUI的React来构建一个简单的表单，代码如下

每次我在 TextField 中输入内容时都会收到此错误

TypeError：无法解构“event.currentTarget”的属性“名称”，因为它为空。

有人能帮我吗？谢谢！！

我需要将节点更新为已编辑的节点。当我编辑和更新节点时，意味着该节点要添加父节点。请帮助我解决这些问题。我将在下面附上我的项目代码沙箱链接。

https://codesandbox.io/s/practical-goldberg-5g7nl?file=/src/App.js

我正在学习打字稿，并试图从 Microsoft Fluent UI 实现一个detailList组件，但我遇到了一些麻烦：

在代码中，单击切换按钮时会引用一个名为 _onChangeCompactMode 的函数

这是它被引用的地方：

我通过将此行更改为此来解决此onChange={this._onChangeCompactMode}问题onChange={() => this._onChangeCompactMode}

我不确定为什么这使它起作用。我的理解是，我传递了一个函数引用。但是为什么它不能按原样工作() =>

这里还是新的，所以欢迎有建设性的反馈。

我在fluentUI的官方页面中查看了fluent detailsList分组示例： https ://developer.microsoft.com/en-us/fluentui#/controls/web/detailslist/grouped

并稍微编辑了他们的示例，因此某些组有 1 行

现在，当我选择行中的项目时，组行（组标题）也被选中

我想阻止这种情况。有办法吗？