问题标签 [fluentui-react]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
839 浏览

office-ui-fabric - 在fluent-UI详细信息列表中隐藏一列

如何在 fluent-UI DetailsList 组件中隐藏/防止列呈现。

0 投票
1 回答
535 浏览

fluent-ui - 如何在 Fluent UI React 的 NavItems 中使用本地 svg 文件

我试图在导航栏中使用自定义 svg 文件,但当时无法渲染。我正在使用流利的反应

我曾尝试使用“office-ui-fabric-react/lib/Styling”中的“registerIcons”,但它对我不起作用。

请帮助我。

0 投票
0 回答
91 浏览

fluent-ui - 在 Theme 中配置 Tooltip 背景颜色

Tooltip使用 aCallout呈现其弹出窗口,但ITooltipStyles似乎不包含subComponentStyles允许您为其标注设置样式的 a。是否可以在主题对象中为标注设置工具提示特定的样式,这样我就不必在使用工具提示的任何地方应用相同的样式?

具体来说,我想为工具提示的喙/喙幕和填充等配置背景颜色。(并非所有标注......只是用于工具提示的标注。)

目前看来我必须这样做:

0 投票
0 回答
26 浏览

fluentui-react - 使用 Fabric UI 在文本字段中添加页脚

我正在尝试在 Fluent ui 中添加页脚以添加 B(粗体)、I(斜体)或附件等图标。有人可以帮我解决这个问题吗?

0 投票
1 回答
307 浏览

reactjs - 将@fluentui/react 与 webpack 捆绑时出现导出错误

我正在编译 webpack 5.25.0,在 6734 毫秒内有 7 个警告版本7.167.0,而v8.10.1我得到 1513,它们都是一样的,类似这样,而不是createElement会有另一个反应函数,比如useEffectv8,捆绑需要 5 分钟在开发模式下,虽然使用 v7 需要 10 秒。

在“react”中找不到导出“createElement”(导入为“React”)

这是webpack配置

webpack.common.ts

webpack.dev.ts

包装.json

至少在 v7 中它正在处理警告,而 v8 也存在 webpack 导出错误。

到目前为止我尝试过的

  1. 删除 tsconfig,因此它可以使用默认配置。
  2. 允许合成默认导入
  3. 移除反应热加载器
  4. 检查了具有相同版本的 CodeSand 框,一切都在那里工作,所以配置可能有问题。
  5. 降级到 React 16

样品在这里在此处输入图像描述

0 投票
0 回答
19 浏览

fluentui-react - 无法对 Menu 组件执行快照测试

我正在使用 Fluent UI React Notthstar 并且我正在尝试对 Menu 组件执行 shapshot 测试。

  • @fluentui/react-northstar@0.52.2
  • 反应脚本@4.0.3

测试代码如下:

  • 我的菜单.tsx

  • 我的菜单.test.tsx

但测试因错误而失败。

如何解决?

0 投票
1 回答
73 浏览

reactjs - 无法在 Outlook Web 加载项项目中安装流畅的 UI 反应

我正在尝试在 Outlook Web 加载项项目上安装 fluent UI,但出现不同的错误:

@fluentui/react - npm说我应该使用npm i @fluentui/react,但我得到:

发行说明中说我应该使用npm install @fluentui/react@^8.0.0并且我得到

我以前没有使用 node 或 react 的经验,所以即使是基本的东西也可以随意指出。

我已经搜索了安装问题,但我能找到的所有内容都与软件包的最新版本无关。我也试过npm install --save @fluentui/react得到第一个提到的错误。

编辑:

我在公司代理后面,这是我的配置:

提前致谢。

0 投票
1 回答
540 浏览

javascript - 受控 Fluent UI Checkbox 组件的渲染不正确

我有一个通过 REST API 与数据库交互的表单,并提供了几个受控的 Fluent UI 组件。对于多选字段,我构建了一个组件,该组件显示一个带有任意数量的受控 Checkbox 组件的 Stack。下面是组件定义。

在表单通过 REST API 检索数据后,该组件使用该数据更新其状态。虽然正确更新了状态并且将正确的值传递给props每个 Checkbox 组件,但 UI 具有误导性。例如,根据 Chrome DevTools 中的 React Components 检查器,checked以下值分别设置为falsetruefalsefalse和。false

包含一个 Checkbox 的 Stack 的初始呈现,选中设置为 true; 没有勾选复选框

显然,虽然props设置正确,但用户会看到五个未选中的复选框。当用户单击本应选中的复选框时,state会正确更新以反映所有五个复选框均未选中。这是用户单击第二个复选框后的样子。

更新了不包含复选框且选中设置为 true 的堆栈表示; 第二个复选框被勾选

用户与 Checkbox 组件交互,它们的行为与预期一样,但对于初始checked属性设置为 的任何位置,底层值都完全反转true

0 投票
0 回答
103 浏览

office-ui-fabric - react northstar fluent ui中的控件显示蓝色边框

我使用 react northstar 创建了一个 SPFX webpart,并将其部署到团队应用商店。我正在使用 react northstar 库,对于所有控件,我在 android 和 ios 手机中都看到了这个蓝色顺序。 在此处输入图像描述

在此处输入图像描述

0 投票
0 回答
95 浏览

fluentui-react - Fluent UI 中的砌体布局?

在 Fluent UI 的示例中,我看到<List>支持动态呈现网格项。 https://developer.microsoft.com/en-us/fluentui#/controls/web/list

在我们的应用程序中,我们有相同宽度但不同高度的网格,并希望它们垂直堆叠在多列中,基本上是砖石布局。

在纯 CSS 砌体布局中完全相同的布局,但最好使用 Fluent UI。

<List>(或其他 Fluent UI 组件)是否支持砌体?

谢谢