问题标签 [fluentui-react]

我正在尝试向我的 React 应用程序中的图标添加一个事件侦听器，以便我可以在单击该图标时触发一个函数（单击周围是TextField不够的）。我需要手动执行此操作，因为元素click上没有属性。fluentui-react

到目前为止，虽然我可以根据我的 console.log 看到已选择了正确的 DOM 元素，但当我单击该图标时，什么也没有发生。

我正在处理这个componentDidUpdate()，像这样：

需要明确的是child，我登录到控制台的显示如下：

<i data-icon-name="clear" aria-hidden="true" class="icon-167">&lt;/i>

所以这是正确的图标元素。但是，当我在控制台中看到它显示后单击它时，什么也没有发生 - 即我的 console.log 中的“Clear icon clicked!” 不会打印到控制台。

请注意，使用 的相关 JSX 块react-fluent-ui如下所示：

iconProps看起来像这样：

我在这里想念什么？

在我的 React 应用程序中，我有一个函数可以根据条件返回一个 JSX 块或另一个块。这按预期工作。问题是，这两个块之间的唯一区别是，在第二种情况下，包含一个图标，以允许清除搜索文本，因为文本现在存在。当没有文本时，不包括图标（因此是其他条件）。

虽然这是可行的，但我想知道，因为两个代码块之间的唯一区别是包含图标，如果有办法我可以以某种方式附加它，而不是像我一样重复代码块现在在做什么？

这是功能：

我是新 Javascript 世界的初学者，想知道两者之间的区别

他们两个似乎都工作得很好。我正在使用 webpack 创建最终的 JS 文件。导入组件的推荐方式是什么？

在 Microsoft 的 Fluent UI Northstar 中有没有使用断点的方法？虽然我承认他们还不支持移动设备，但即使在桌面上，您也可以响应窗口大小的变化。

我不明白是否可以自定义 Fluent UI 的仪表板模板 https://dev-int.teams.microsoft.com/storybook/main/index.html?path=/story/ui-templates-dashboards- -默认值。例如：问题 1 - 是否可以将单张卡片的高度增加到 ？问题 2 - 是否可以将卡片的背景从白色更改为透明背景？

我试图弄清楚如何在 Fluent UI react 中使用可折叠列表。奇怪的是，在 Fluent UI 网站上：这里所有控件都以可折叠的方式排列在左侧，但控件本身并未在选项中列出。

我只想拥有与流畅 UI 页面上的可搜索列表完全相同的控件。

我搜索了网络，但我只找到了这个

但这是针对共享点框架的，对于我想要的东西来说它看起来有点矫枉过正。

有人可以帮助我吗？

我正在尝试使用 Typescript 和 React 通过 i18n 解决方案本地化 Fluent UI 组件。但是我在更改财产名称时遇到了困难。

i18n 是根据文档使用钩子实现的（在通用组件中效果很好）

但是当我更改语言时，我无法更改 CommandBar 项目名称

从功能组件

项目在单独的文件中

我的问题是 CommandBarItem 在开始时只翻译一次.. 对语言更改没有反应。

我也尝试在组件内部使用Memo，但没有成功：

请问有人可以帮我解决吗？

我正在尝试使用 Fluent UI创建一个TeachingBubble 。我希望它有关闭按钮，标有“x”。我想要一个像这个例子中的关闭按钮：

使用 Fluent UI 如何在反应中做到这一点？

我当前的代码：

这就是我得到的：

关闭按钮存在，但没有“X”。我认为当“hasCloseButton”设置为true时默认添加“X”。

Fluent UI Northstar 带有一个调色板。我可以在文档中找到颜色名称和渐变，但我应该如何在 TypeScript 中使用名称和渐变值（100、200 等）？我找不到任何文档或示例。

Dialog component in Fluent UI has DialogFooter. I want to place a button inside that footer and I want it to be in the center. How can that be achieved? I'm unable to move it from its default location.

Sample code (taken from [official docs][https://developer.microsoft.com/en-us/fluentui#/controls/web/dialog#IDialogStyles], slightly modified). The most important part should be at the bottom of the code:

That looks like this:

How can the button be moved to the center, where I draw the blue "circle"?