问题标签 [react-class-based-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 回答
79 浏览

reactjs - 使用 React 上下文将对象传递给 context.provider 的值时如何避免重新渲染

在类组件中,当我们想使用反应上下文将对象传递给上下文提供者的值时,我们有一种方法可以避免重新渲染问题。下面是代码

我们将 this.state.contextState 设置为 CountContext.Provider 的值。因此,当用户在输入元素中键入任何内容时,不会导致<Container1 />重新<Container2 />渲染。这里是代码沙箱:https ://codesandbox.io/s/qqx1jqk8mj?file=/src/index.js:260-1105

我正在尝试将其转换为钩子。这是代码沙箱https://codesandbox.io/s/affectionate-gauss-duk64?file=/src/index.js但计数器无法正常工作。请问哪部分错了?谢谢

0 投票
1 回答
34 浏览

reactjs - “保存调色板”按钮给出了“保存调色板”的 TypeError 不是函数

我的 'NewPaletteForm' 是一个功能组件,因为我使用了react hooks

因此,当我单击“保存调色板”按钮时,会出现一个错误,提示“ props.savePalette 不是函数”。

错误:- TypeError:props.savePalette 不是函数

代码:

'应用程序.js':

'NewPaletteForm.js' :包含反应钩子的功能组件

NewPaletteForm 组件中的按钮:(使用的 Material UI 按钮组件)

0 投票
1 回答
112 浏览

reactjs - 动态表单 - 如何使用反应钩子更新“onChange”事件中多个表单字段的值?

使用基于类的组件,我们对多个输入字段这样做

但我想用钩子来做:

我知道如何为每个单独的字段执行此操作,但我想像在基于类的组件中那样编写通用代码,这样我就不必为每个字段重复。

0 投票
1 回答
93 浏览

reactjs - 在单独的类中反应路由器

我有一个工具栏类,其中包含我的开关和路由标签。我的 React 应用程序运行良好。但我现在想创建一个单独的文件,它只专用于路线。我想知道我应该遵循哪些确切步骤来确保一切正常。

0 投票
2 回答
501 浏览

reactjs - 使用 react 和 typescript 仅切换 map 数组的一个元素

我正在映射评论 API 的数组,当我点击“阅读更多”时,我只想显示点击的评论,但目前正在扩展我的数组的所有评论,我正在使用打字稿,这对我来说都是新的所以我不知道如何移动,我应该如何将索引的信息传递给我的状态?

0 投票
1 回答
62 浏览

reactjs - 用 react.js 创建钢琴,使用状态不清楚

我即将为钢琴建立一个键盘,我想使用状态来处理按下和未按下的键(最终产生声音的键,以便我可以弹奏单个音符和和弦)

我通过以下方式修改了一个在线教程:首先我创建了这些对象:

我的第一步是将按下的键盘键加载到连接到全局状态对象的数组中。稍后我想为该状态数组中表示的键盘键表示的所有对象创建声音。但首先要做的事情。

当我按下一个键时,为什么this.state.pressedKeys(扩展运算符)未定义?

TypeError:无法读取未定义的属性“pressedKeys”

0 投票
1 回答
217 浏览

css - 如何在 React JS 中的 css 转换结束后使用 setState?

当我点击一个按钮时,我想要一个 div 出现(使用不透明度 1)并过渡到顶部并在到达顶部后淡出(使用不透明度 0)。

但它并没有按我预期的方式工作。目前,它会立即淡出。它不会等待过渡结束。我希望它在过渡结束淡出。

React 有办法修复它吗?我对反应很陌生。非常感谢您的帮助。谢谢。

0 投票
2 回答
78 浏览

reactjs - 反应(基于类):在将对象从子组件传递到父组件后,如何使用 setState 更新父组件中的 JSON 对象?

我在“Data.js”中有 JSON 数据,在“App.js”中它被初始化为状态。

在“App.js”的“updateList”方法中,我得到“dataa”——来自“Form.js”的“insertIt”,我也需要在“App.js”的“updateList”中“setstate”。

请帮我纠正“Form.js”的“insertIt”方法和“app.js”的“updateList”方法

应用程序.js

项目.js

表单.js

数据.js

谢谢

0 投票
2 回答
133 浏览

javascript - 将类组件转换为函数组件

我是 React 的新手,我正在尝试将https://devexpress.github.io/devextreme-reactive/react/scheduler/docs/guides/view-switching/中的 viewSwitching 合并到我的项目中。我面临的问题是这个视图有类组件并且我已经在功能组件中编写了我的代码,有没有办法将下面给出的代码实现到功能组件中,以便 viewSwitching 可以工作?

任何帮助都将不胜感激:)

0 投票
1 回答
39 浏览

javascript - 将基于类的组件转换为未读取的功能组件输入查询

我正在尝试将此类基于组件的组件转换为函数组件。由于某种原因,handleFormSubmit函数没有读取Query ( setQ ) 。当我将 setQ 中的参数设为对象时,输入表单的值变为 [object, Object]。我究竟做错了什么?

类组件

功能转换