问题标签 [react-toolbox]

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 回答
53 浏览

reactjs - 在 ThemeProvider 中使用 React Toolbox Tabs 时出现错误

App.jsx 是:

错误:

TypeError:无法读取未定义 Tabs.render @ line 240 var classNamePointer = (0, _classnames4.default)(theme.pointer, _defineProperty({}, theme.disableAnimation, disableAnimatedBottomBorder)) 的属性“指针”;

0 投票
1 回答
67 浏览

reactjs - react-toolbox 依赖项:未捕获的类型错误:无法读取未定义的属性“字符串”

我尝试将 react-toolbox 与 webpack 4 和 react 16 一起使用,但我在加载 react-toolbox 依赖项时遇到问题,它们不需要 prop-types,尽管它存在于 node_modules 中:我收到错误消息:

https://monosnap.com/file/iUQAtohH4Zuv9uKeNSXqkJWG8IOZ5U

这是我的 webpack 规则:

我的 postcss.config.js:

我的 package.json:

0 投票
1 回答
1818 浏览

css - Internet explorer 11 & webpack V3 - 不捆绑 css 变量

我正在开发一个与 webpack 捆绑的 React\Redux 项目。

将 webpack V1 升级到 V3 后,IE (11) 支持被破坏,部分元素附加了 css 规则,IE 无法处理。
在谷歌浏览器上一切正常。

损坏的 CSS 规则

在此处输入图像描述

包.json

webpack.config.js:

0 投票
1 回答
338 浏览

css - React-Toolbox:尝试将卡片水平对齐

我正在使用 React-Toolbox,在这种情况下,我怎样才能让这些 Card 元素水平对齐,彼此相邻。我试过display: inline-block了,它把它们分成三张单独的卡片,这是我最终想要的,但它并没有将它们彼此对齐。

0 投票
1 回答
51 浏览

reactjs - reacttoolbox输入组件不验证字符

我正在使用带有 type="tel" 的 React-toolbox 组件输入

你如何防止组件不接受像字母这样的无效字符?

我希望它只接受数字。输入只能是一个有效的电话号码,包括国际格式。


这是一个示例代码

0 投票
0 回答
65 浏览

reactjs - React-toolbox 日期选择器日历对话框正在将 DOM 移到顶部

我对 react-toolbox 的日期选择器有问题,想问问也许有人有同样的问题。因此,当我单击日期选择器时,输入日历对话框打开并将背景移动到页面顶部。我希望该模式将在我单击的相同位置打开。

我正在使用非常简单的日期选择器:

也许有些人与其他反应工具箱对话框有同样的问题?我将不胜感激。

0 投票
1 回答
169 浏览

javascript - React / Redux alerting best practices

I'm new to redux, and I'm rebuilding a fairly complex reactjs app using redux.

I thought it made sense to build a "feature" for notifications that would have a slice of state with like

that would control how the notice shows, what position, what alert colors are used, etc.

However, now that I'm getting down to the implementation, I'm finding that I want to show notifications based on other features' state. For example, in my blog-posts feature, I fetch data from the server via a thunk and I'd like to set a notification based on the state of the thunk:

The obvious problem is that you're not supposed to dispatch action from reducers. Is this just a bad idea in general, or is there a way to set the notification state from a thunk response? Is there a "best practices" way to deal with this?

0 投票
0 回答
70 浏览

reactjs - 错误:超过最大更新深度(再次!)

我猜这是 React 101 并且被问了很多次,但我看不出我做错了什么。

某些原因导致此代码进入无限渲染循环并崩溃。我怀疑 isLoggedIn 标志,但现在不太确定。x.loginSlice.isLoggedIn 是一个直接布尔值,它被设置在由 redux-toolkits createSlice helper 创建的 reducer 中。我认为它没有违反任何“不改变状态”规则。

我的假设是,只有当 useSelector 上的相等检查功能检测到 redux 存储发生变化时,才应该重新渲染。也许有别的东西在做?可能是位置?我仍然不知道究竟是如何通过反应路由器“神奇地”传递位置的。

谁能看到我做错了什么?

谢谢 :-)

其他资源

在阅读了一些评论后,我更深入地了解了正在呈现的其他页面。

根据反应分析器:

  • “路由器”似乎是参与正在进行的渲染循环的最高级别组件
  • 路由器的“为什么要渲染”是“状态已更改:位置”。我正在更多地研究路由器文档。

如果有帮助,我在这里分享了一些文件。包括崩溃期间的控制台日志、导出的反应分析器数据和所有 tsx 文件。我已经对后者进行了修改,以尝试使它们尽可能简约。

再次感谢你的帮助!尽管脱发,我觉得我在这里学到了一些重要的东西。

编辑2:它似乎工作,但我不知道为什么。

如果我删除state: {from: location}问题似乎消失了。我不知道为什么,但请注意,即使在导航到page/login应该只是一条正常路线时,这条 privateRoute 仍在呈现。我想知道是否可能是原因。也许位置对象中不断变化的 pathName 正在更改传递给的道具PrivateRoute并导致它进入无限循环。

无论如何 - 现在我没有被困住。如果有人想向我解释这一切,我会留下这个问题。