问题标签 [chakra-ui]

我想创建这样的主题：

然后就像使用我的过渡一样

或类似的东西，但我不能像在jsx中使用变量那样真正定义它。有没有办法做到这一点？

BottomMissionText.tsx

任务文本.ts

MissionBox.tsx（片段）

我已经尝试了将近两个小时，并且一直收到此错误（标题）。

我正在使用 next.js 开发一个 Web 应用程序，并且在移动设备上的 Safari 中，我的 react 组件中的 flexbox 样式属性在初始渲染时没有正确定位元素。我必须实际单击菜单按钮，然后它似乎正确地向右移动。请参阅下面的图片和代码。为什么会这样？在其他所有浏览器的移动设备上都可以正常工作。

尝试将 ChakraProvider 添加到我的 NextJs 应用程序根目录时，出现错误：

未捕获的错误：应为字符串。您忘记从定义的文件中导出组件，或者您可能混淆了默认/命名导入

更新以响应 v17.0.1 后，错误不会出现。

为什么 ChakraProvider 无法与 React v16.4.0 一起使用？

当我的表头数据放在 .map() 方法中时，我正在尝试对表进行排序（升序/降序）（请参阅本文中代码框链接的第 73 行）。

我可以让手形表情符号更改 onClick，但不会进行排序。我认为这可能与将对象传递给 map 方法有关，而不是在我基于此功能的代码框中找到的单个字符串或数值。这是我建模的原始沙箱： https ://codesandbox.io/embed/table-sorting-example-ur2z9?fontsize=14&hidenavigation=1&theme=dark

...这是我需要排序的数据结构的代码框： https ://codesandbox.io/s/table-sorting-example-forked-dofhj?file=/src/App.js

为了使每列可排序，我可以更改什么？任何帮助/建议将不胜感激。

应用程序.js

我正在尝试将此表格排序解决方案实施到我正在开发的应用程序中。这是我正在尝试实现的具有排序功能的工作代码框： https ://codesandbox.io/s/table-sorting-gxt7g?file=/src/App.js

但是，当我尝试在我的应用程序中实施此解决方案时，出现错误：

它指向包含let sortableItems = [...items]. 无论我是否将项目初始化为空数组，我都会收到此错误： const useSortableData = (items = [], config = null) => { ...或者我如何在下面拥有它。

我正在尝试传递myArrayOfObjects给useSortableData().

有人看到我做错了吗？

我应该提到这是基于本文中的一个示例：https ://www.smashingmagazine.com/2020/03/sortable-tables-react/

我正在使用 typescript 构建一个带有 nextjs 和 chakra UI 的 Web 应用程序。我使用反应钩子表单进行表单验证，但是当我将它部署在 vercel 上时它会导致问题。查看图像以查看错误消息。

我正在尝试在他们的文档中的 Chakra-UI 的“不确定”复选框示例中添加更多复选框：https ://chakra-ui.com/docs/form/checkbox

我似乎不能添加两个以上的复选框，并且仍然保留切换所有复选框和/或选择单个复选框的功能。理想情况下，我希望能够使用 .map() 方法添加 x 个复选框，并且能够单独选择每个复选框以及所有复选框。任何帮助是极大的赞赏。

不工作：