问题标签 [react-component]

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

reactjs - withStyles() 返回的组件类型是什么?

我有一个Dictionary属性非常简单的组件:

在另一个组件的道具中,我请求了一个只需要一个字符串单词的通用组件:

它的父母像这样使用它:


现在我想尝试 JSS(MaterialUI 已经在整个项目中使用,所以不,整个库不仅仅用于单个组件)。我创建了一些样式并DictionaryProps相应地更新了:

Dictionary将样式传递给React.ComponentClass-accepting时会产生以下编译错误UsesDictionary

我通过直接使用它来确认Dictionary匹配:React.ComponentClass<{ word: string }>

这表明我没有弄乱Dictionary.


  1. 我可以使用any而不是具体类型,但我已经为这个项目设置了一个规则,不要使用any. 无论如何,这是一种不好的做法,因为它失去了类型安全性。

  2. 我尝试直接使用错误中的类型 - StatelessComponent<Overwrite<DictionaryProps, StyledComponentProps<"root">>>但是

    • 它有一些Overwrite我不知道的类型,也没有找到它所在的位置。我猜它来自 MaterialUI,我不想链接UsesDictionary到它。
    • 它需要样式 DictionaryProps化的,而不仅仅是{word: string}部分,。而且我不想将 myUsesDictionary与任何具体的字典类型结合起来,所以我不希望它知道字典是否使用withStyles

    即使用错误中的类型不是一个可行的选择。

其他有withStyles问题的人使用它作为装饰器,因此他们的错误。在这里,这不适用,因为我已经将withStyles其用作普通函数。


简而言之:

我应该如何键入dictionary属性UsesDictionary以便它接受withStyles-ed 组件?

0 投票
2 回答
288 浏览

reactjs - 在 React 中的哑组件内部映射/循环

我创建了一个被这么多数据使用但显示相同的哑组件。

问题是,只接受本机数据类型或对象数组是更好的哑组件吗?因为我的数据属性是每个表的差异。

优点:没有对象属性依赖

缺点:智能组件中需要循环,这使它变得 混乱

优点:智能组件更简单

缺点:哑组件只接受特定的数据属性

那么哪个更好呢?我确实使用了第二个并将其映射到我的 component.ts 中首先更改对象属性,但这会使 component.ts 变得混乱

0 投票
1 回答
1543 浏览

react-native - 在本机反应中创建双向重复/循环无限滚动视图

我想创建一个重复的滚动,一次又一次,即当我继续滚动到顶部时,我到达最后一行,当我滚动到底部时,我再次到达第一行。

我曾尝试搜索相同的组件,但我能找到的最好的是这些 -

react-native-infinite-scroll这个 stackoverflow 答案,但它们都只告诉我当我到达 ScrollView 或 ListView 端时如何加载更多数据。

0 投票
3 回答
14052 浏览

javascript - 单击按钮时,在函数内调用 React 组件

组件未Container呈现。谁能指导我为什么我无法渲染Container组件?

应用程序.js

容器.js

0 投票
1 回答
2397 浏览

javascript - React TinyMCE - 数据未绑定

我创建了一个textarea带有使用 Tiny MCE 选项的 React 组件,我使用该组件实现了该react-tinymce组件。

我基本上会使用这样的组件:

所以基本上如果mce道具设置为true你得到 TinyMCE 组件。

但是,虽然常规textarea版本会绑定您输入的任何内容 state.data.body,但 TinyMCE 版本不会。

请注意,此Textarea组件用作带有 onSubmit 方法的表单组件的一部分。

0 投票
3 回答
46208 浏览

javascript - React 警告:函数作为 React 子级无效

我有这个反应组件。这没有正确渲染,但会收到一个烦人的警告,例如

函数作为 React 子级无效。如果您返回 Component 而不是从渲染中返回,则可能会发生这种情况。或者,也许您打算调用此函数而不是返回它。

这是我的组件。我在这里做错了什么?

更新

@Ross Allen - 进行更改后,渲染方法似乎处于无限循环中,可能会导致内存崩溃

0 投票
0 回答
135 浏览

reactjs - saga 可以在我们刷新浏览器的时候执行这个函数吗?

'我在刷新浏览器时尝试跟踪执行我发现 saga 不执行函数 fetchOrders。

你有想法吗 ?'

反应组件:

动作文件:

0 投票
2 回答
2959 浏览

reactjs - 在无状态功能组件中使用 Ref 在 React JS 中不起作用

我正在开发一个 React JS Web 应用程序。我是反应js的新手。现在,我正在尝试在无状态功能组件中使用 Ref 来检索输入值。我遵循了我在网上找到的一些解决方案。

这是我的组件

如您所见,我使用 ref 检索电子邮件和密码输入字段的值。但是,当我运行时,它仍然给我这个错误。

那么,我该如何修复我的代码呢?如何在无状态函数组件中正确使用 Ref?

显然,我遵循了这个,如何在 React 中附加到无状态组件的 ref?

我也尝试使用该课程。它给了我同样的错误。这是我的组件的类版本。

0 投票
2 回答
7661 浏览

javascript - 如何从 rc-slider react 组件输出当前值?

我在我的 React 应用程序上安装了 rc-slider React 组件,但我需要从滑块输出当前值,我该怎么做?这是当前代码:

另外,如何从工具提示中更改字体系列,在抓取滑块的手柄时显示值?

0 投票
2 回答
45 浏览

javascript - 如何从 React 组件中读取子元素

我想获取一个反应组件的所有子元素的列表。

例如:

父.js

SomeComponent.js

所以Parent.js我想得到ChildElement1and ChildElement2。那可能吗?

我的用例是:

我将表单字段(字段组件)传递给通用表单组件。Form 元素接收一个具有默认值的对象以及其他东西(例如,它与什么 CRUD/资源相关)。它必须在字段中注入这些值。我没有一一传递所有字段并避免重复,而是创建了像“UserFields”和其他一些容器这样的容器,它们是具有字段组件的容器。所以我需要 Form 来读取 UserFields 中的字段。但由于这些字段已经在 UserFields 中,我不知道如何获取它们。