问题标签 [office-ui-fabric]

概括

当建议中不存在输入的内容时，有谁知道如何让 UI Fabric React TagPicker 添加新项目？

我还想向服务发送 AJAX 请求以在后端添加新项目。

所需功能

当有人在选择器中键入选项中不存在的内容时，他们应该可以选择将其添加为新选项，并调用其他代码将此新选项添加​​到后端 API。

到目前为止我尝试过的

我已经能够pickerSuggestionsProps.onRenderNoResultFound使用单击处理程序添加一个按钮，该处理程序将运行一些代码来添加关键字，但这涉及挂钩onChange以跟踪用户输入的内容，但这会破坏建议的选择（当 onChange 是处理后，用户无法从选择器下方显示的列表中选择建议）。

我对office ui fabric-react 很陌生，而且一般都会做出反应，所以如果我做错了，请不要犹豫，给我指点。

尽管我的要求相当简单，但我就是想不通。

我有一个带有列表视图的页面（office-ui-fabric-reactjs 的 DetailsList 组件），这个 DetailsList 从运行正常的 API 端点获取它的项目：

DetailsList 被完美填充。但是，现在我想为每一行添加一个“编辑”按钮，所以这不是单独的列。

我想我会onRenderRow在 DetailLists 呈现的属性上执行此操作：

在onRenderRows函数中我首先获取所有的DetailsRow道具，然后添加编辑按钮：

问题是按钮一直显示在数据行下方。我应该通过添加来解决这个问题，css还是让按钮位于同一行的最佳选择是什么？

有没有更简单的方法来实现这一点？我还尝试/研究了为按钮添加额外列的选项，但我不认为这是要走的路，而且我也没有这样做。

附带说明一下，我在 ES6 中使用结构组件而不是 TSX（您可能已经注意到了）。

我已将 Fabric 更新到 6.6.1 版，并注意到组件isSearchBoxVisible中缺少该属性CommandBar。

如何替代它？我在我的应用程序中广泛使用它。

我需要在 office-ui-fabric Dropdown 中对提供给“onChanged”事件的回调进行单元测试（使用 spyOn 和 expect(callback).toHaveBeenCalled()）。问题是我不知道如何触发这个事件？我试图查看 DOM，但没有可以触发的 html 选择标记。我还尝试更改所选项目的状态（在下拉组件上），但我收到一个错误，Jest 告诉我我只能更改根元素的状态（我尝试使用浅层、挂载和潜入下拉组件）。有没有简单的方法来实现这一点？

我正在使用 Jest 和 Enzyme 和这段代码：

它输出这个html：

没有“.ms-Dropdown-item”

根据其文档，Fabric 的对话框组件默认将dialogDefaultMaxWidth设置为 '340px' 。我想将其更改为“640px”，但我不知道该怎么做。文档正在使用Typescript解释所有内容，所以我有点困惑，因为我对该语言一无所知。我只知道Javascript。

我使用用 React + Typescript 编写的 Fabric 组件，当使用 Checkbox 组件时，我可以添加自定义属性等data-id- 这也写在文档中：https ://developer.microsoft.com/en-us/fabric#/components /复选框

有什么问题 ？我不知道如何通过将其传递给inputProps.

HTMLAttribute字段的 React 接口data需要string值。

从我所见，React 的接口HTMLAttribute是通用的，Checkbox 组件在那里传递了这个接口：https ://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react/global.d.ts - 它们是空的。

有人知道如何在那里实现data-属性吗？

我正在使用组件下拉菜单，当我单击图标时，我有选项列表，它是一个 div ms-layer，它在正文结束之前添加，当我单击下拉菜单以隐藏列表时它被删除的选项。

我想做的，就是把这个div ms'layer放到一个特定的div中，比如就在Dropdown的div之后，而不是body的末尾之前。

这是我的代码：

我想自定义 aPivotItem以使其可以关闭（有点像浏览器选项卡）。

我提供了一个自定义 onRenderItemLink实现X，在选项卡的右侧显示一个图标，并在该图标上显示一个onClick关闭选项卡的方法。

我面临的主要问题是它被一个（呈现一个）PivotItem包裹，它拦截了所有 onClick 事件。buttonPivot.Base.tsxCommandbuttonFirefox

Firefox 不允许按钮下的 onClick 事件（这似乎符合标准，因此不被视为错误），因此我永远无法关闭 Firefox 上的选项卡。

在这种情况下，有什么方法可以强制 Fabric UI 创建 div 而不是按钮？

有没有其他方法可以强制 div 存在（某种方式来拦截结构 ui 创建的内容并使用 div 切换按钮）？

建议表示赞赏。

我正在学习 React，我正在尝试实现以下目标：我正在使用下拉列表，它允许用户选择多个项目。然后我试图将每个选定的选项添加到一个数组中。然后我想在渲染方法中显示选定的项目（选项），但它不起作用。

稍后我想将此组件转换为可重用的组件，以便执行级联。

所以，我的问题是：

下图显示数组的长度为 1，但我无法显示项目。它是空的。

下面我包括我到目前为止的代码：

我指的是来自https://dev.office.com/fabric-js/Components/ContextualMenu/ContextualMenu.html的 Multiselect ContextualMenu ，我能够编写一个示例。在 HTML 中，我添加了另一个按钮（应用），单击该按钮我想在 ContextualMenu 中提取所选项目。

任何人都可以帮助我使用 javascript 代码，点击按钮（应用）后，该代码将为我提供上下文菜单中的选定项目？

感谢您对此的任何帮助。