问题标签 [grommet]

在 GrommetFormField文档中，它在Component下声明；

该组件可以是自定义的，只要它支持 name、value、onChange (event => {}) 的属性，而 event 具有 event.value 或 event.target.value。

我想实现一个自定义组件，但不明白它需要如何与受控Form组件交互以提供其value属性。是否有某个示例显示了如何在 a 中实现自定义组件FormField？

我正在使用这样的 React Context并且真的陷入了如何更新我的视频元素（播放视频）。收到道具时组件不应该自动更新吗？

这是我的代码的简化版本：

和（在我的情况下非常嵌套的）子组件

语言上下文.js

到目前为止一切正常，“语言”可以记录到根组件中的控制台，但如果我尝试将它作为参数传递给视频，则不会发生更新。点击后如何启动视频？

这是我在 FormField 中使用服务器端搜索的 Select 组件的基本实现：

预期行为

I expected users to search & select options indefinitely without selected option becoming blank when it's not present in the options array.

实际行为

如果用户搜索一个类别并选择，那么它会正确显示为选定的选项，但是当用户再次搜索并且选定的选项没有出现在服务器端结果中（换句话说，不在选项列表中）时，那么选定的选项变为空白。

1. 在这里，我有意在每次搜索时只呈现一个结果。

2.首先，我选择“Tijolo”类别。

3. 然后我换成“Ferro”。

4. 最后一步我再次打开选择下拉菜单，它调度请求“onOpen”事件，结果页面中不存在“Ferro”，然后它的选项变为空白。

正如我现在所看到的，“onSearch”事件似乎不会使其空白，但“onOpen”会。我想知道为什么（？）。

有谁知道如何处理“onOpen”和“onSearch”事件在索环选择组件中呈现动态选项？

索环版本：2.17.2

我正在使用 Grommet，我创建了两个 FileInputs，并从他们得到的图像中生成了一个新图像。我的问题是：有没有办法调用我从按钮中的 FileInput 获得的图像？如果是，如何？感谢您的任何回答。

代码（取出一些不相关的垃圾）：

我试图更改我现有的应用程序以使用 Grommet 作为输入。它工作得很好，但我遇到了样式问题。

react-App 包含在不同的页面中，因此我必须处理不同类型的全局 css 样式。在 Grommit 之前，我使用了内联样式，因此我能够使用all:revert它来摆脱我的 react 容器中的大部分全局样式。但这styled-component不起作用，因为它还会从我的应用程序中清除样式。

问题是全局样式比样式组件中的索环样式更具体。

有办法解决这个问题吗？也许让 styled-component 风格更重要？或者阻止任何其他全局样式。

例如 HTML 页面上的 CSS 会破坏控件（取自使用我的 react 应用程序的 wordpress 主题）将是：

索环控制看起来非常基本：

来自 Grommet 的损坏的选择控件

现场示例

来自实时示例的代码

您知道如何处理全局样式并使控件正常工作吗？遗憾的是，我无法访问全局样式，因此我需要在我的 react 应用程序中找到解决方案。

一个想法是仅将 react 应用程序包含在 iframe 中，但如果有任何方法我想避免这种情况。（也许没有别的办法）

祝你有美好的一天，亚历克斯

Grommet 是否有一个内置的解决方案，只允许在数据表中进行单个或多个选择？我想出了这个 useState 函数，它在设置之前清除数组，但它有强制用户单击两次的不良反应。如果数组 > 1 用户单击，则将选择数组设置为 [] 强制用户再次单击。

更新：在函数中使用 Slice 修复了双击。

我想在 Html 中循环使用具有不同输入的函数 SliderComponent 以创建多个组件。我在网上找到了这个解决方案，我们使用“id”和“getElementById”构建字符串并以 Html 形式返回，但我无法让它工作。

我收到以下错误：

在：

document.getElementById("output_div").innerHTML = outputHTML;

这是正确的方法，还是有更好的方法？

我收到以下错误：

未捕获的错误：超过最大更新深度。当组件在 componentWillUpdate 或 componentDidUpdate 中重复调用 setState 时，可能会发生这种情况。React 限制了嵌套更新的数量以防止无限循环。

其次是：

上述错误发生在“图表”组件中

我唯一使用的 Chart 组件（来自 grommet 组件库）来自这段代码：

我一生都无法理解为什么这会导致无休止的重新渲染。任何帮助将不胜感激。

我是 React 新手，之前也从未写过任何测试用例。我有一个项目需要使用 Grommet 库编写单元测试（在 Jest 中，React-testing-library）和组件。一切都已设置好，但我很难模拟小尺寸（移动）以检查一切是否正常运行。测试完全按照我想要的大小呈现，但问题是当我编写测试用例时，它不会以小尺寸呈现组件，而是始终以默认大小（1024px）呈现它。我尝试使用 React Hook (useRef) 的大小而不是 Grommet 库支持的大小来更改代码，但它也不起作用。由于项目要求，我无法更改代码:((

你有什么想法为什么它不起作用？预先感谢您的帮助！以下是我的模拟尺寸供您参考：

我是 ReactJS 的新手，并且正在开发一个在不同点显示标记的项目，数据是从 JSON 文件接收的。目前，我正在使用弹出窗口来显示单击标记时的信息，如图所示：

如上所示，弹出窗口当前显示每个标记的标题和描述，由 JSON 文件中的数据提供。但是，我想使用更现代、更通用的东西来显示这些信息，例如 Grommet Card ( https://v2.grommet.io/card )，因为当前的 Mapbox 弹出窗口不是很吸引人。我该怎么做呢？