问题标签 [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 投票
2 回答
97 浏览

reactjs - 从反应功能组件调用反应类组件中的方法时,状态是否可见?

我正在构建一个反应应用程序,我遇到了以下问题:

我有一个博客。该博客是使用这样的类组件实现的:

该组件基本上维护了一个博客文章表,如下所示:

在此处输入图像描述

问题是阅读更多...链接。在上面的代码片段中,我将 read more 链接的处理程序传递到 createTable() 中的博客表。Table 组件是一个功能组件。它看起来像这样:

当有人点击阅读更多链接时,它会调用博客组件中的 readMoreClicked() 方法(也在上面的代码片段中)。但在 readMoreClicked() 方法中,它告诉我状态未定义:

在此处输入图像描述

这让我想知道博客组件的状态是否不一定会因为您从功能组件调用其中的方法而进入范围。<--这是问题吗?还是有其他事情发生?

谢谢。

0 投票
1 回答
643 浏览

reactjs - 如何在反应类组件中获取参数ID

我想要一个来自此类组件中 url 的参数 id

应用程序.js

Products.js

我确实检查了一些问题,但我没有得到类组件

提前致谢

0 投票
0 回答
30 浏览

reactjs - React-Native:何时使用类或功能组件?

我对react/react-native很陌生,想开发我的第一个应用程序。在编程过程中,我看到有两种不同的方式来声明一个组件。据我了解,如果我想访问状态变量,我总是必须使用类组件。但是根据反应文档,也可以通过功能组件内部的 useState 访问状态变量,现在我不知道使用什么作为最佳实践。

关于何时使用类和何时使用功能组件是否有某种规则集或编码模式

非常感谢您!

0 投票
1 回答
1271 浏览

javascript - react函数组件中如何实现全局变量

我是新来的反应,并决定通过使用类和功能组件实现一个简单的秒表来练习。

我使用类组件成功实现了秒表。下面是代码:

类组件

现在我正在尝试实现上面相同的代码,但使用如下所示的功能组件:

功能组件

问题

在类组件中,我使用 handleClick 函数实现了“暂停”功能,该函数调用 clearInterval 并将其参数作为我最初声明的全局变量 stopms、stopSeconds、stopMinutes。这工作得很好,因为当秒表开始计数时,这些全局变量保存着从各自的 setInterval 返回的值。

现在在功能组件中,我通过使用“let”关键字声明相同的全局变量来复制相同的逻辑。但是“暂停”功能不起作用。当点击“开始”按钮并调用 handleClick 函数时,将调用 setIntervals 并将它们的返回值存储在各自的全局变量中。但是当点击“暂停”按钮时,所有全局变量的值都是“未定义”。

请我想知道是否有任何其他方式可以声明全局变量并使用它们在组件的整个生命周期中使用状态来保存值。

0 投票
1 回答
100 浏览

javascript - 加载 componentDidMount 后重新加载渲染函数

我正在尝试在我的 react.js 网站上加载 ecwid 商店。我创建了一个类组件,其中有一个名为 load ecwid 的函数。我已经把函数放在componentDidMount(). 控制台日志告诉我该函数加载得很好。但是,除非我手动刷新页面,否则屏幕上不会显示任何内容。

以下是我的代码:

0 投票
0 回答
59 浏览

reactjs - 反应 shouldComponentUpdate 新旧道具相同

在我的代码中,有一个子组件从父组件接收道具,我正在映射该数组以渲染其名称,添加图像按钮和一个子组件用于渲染图像(这是为了避免重新渲染图像)。

当我添加图像时,孩子的孩子重新渲染它工作正常,但是当我通过孩子的孩子删除按钮删除图像时,图像会从父状态中删除,但孩子的孩子不会重新渲染,因为 shouldComponentUpdate 的旧道具和新道具将是相同的。

谁能建议为什么会这样?

子组件

Child的子组件

为什么当我控制台新旧道具时新旧道具相同然后图像被删除但新旧道具值是新更新的图像状态值。这就是为什么它不会重新渲染但删除的图像仍然显示

0 投票
1 回答
638 浏览

react-native - 我应该使用全局变量来保持当前用户的会话保持原生反应吗?

目前我正在开发一个需要人们登录到应用程序的 React Native 应用程序,我已经创建了登录页面、服务器端身份验证等。我的问题是,如何将用户登录信息保存在客户端中-以我可以在整个应用程序中访问它的方式?将用户名和密码保存在全局变量中是不是一种不好的做法,所以我可以在用户访问/更改应用程序中的页面时使用它们来验证用户(这种方法使我必须将整个应用程序代码编写在一个文件中但是),还是我应该尝试找到一种方法来通过在不同页面呈现功能上反应原生道具来传递用户数据并在其他页面中访问它?

0 投票
3 回答
51 浏览

javascript - 如何修复 - 函数作为 React 子级无效?

我正在调用一个返回一些 html 代码的函数。

但是如果我想给这个函数发送一个参数,那么它告诉我Functions 作为 React child 无效,问题是我想从函数中访问道具,为了做到这一点,我改变了调用jsx 为:

我尝试在组件内部设置状态,并从 componentDidMount 设置状态

但是,在里面componentDidMount,并没有,在构造函数里面this.props.country设置也没用。this.componentDidMount.bind(this)我能做些什么来修复它?

0 投票
1 回答
116 浏览

javascript - 使用 React.js 类组件中的函数更改状态的属性

我有一个使用 react-h5-audio-player 的基本音频播放应用程序。

在其基本形式中,AudioPlayer组件需要一个源,我已将此媒体存储在本地,并试图围绕 AudioPlayer 构建一个父Player组件作为父组件,其中包含使用类组件切换媒体源的功能。

我已将曲目的标题及其数据路径存储在包含三个对象的单个状态中。我正在寻找更改 AudioPlayer 的来源,使用函数更改数据引用。

这是我的代码,尝试使用 psudo 填充逻辑,这些区域周围有 Asterix:

大多数在线指导都是关于改变状态和使用this.setSate来改变整个状态本身。当我试图更改/表示特定属性时,我正在努力使用它。

任何指导或建议将不胜感激!这是我第一次使用 gatsby / react.js,如果我用错误的逻辑来处理这个问题,我深表歉意。

0 投票
0 回答
70 浏览

reactjs - 将 React 类组件转换为 React 函数式组件

我有这个新库,我想知道是否有人可以帮助我将这个类组件用于反应功能组件。我正在尝试包含它,并且我的所有代码都使用 hooks 和新版本的 React,所以我想继续从事这项工作,但是这家公司还没有 RFC,所以当我开始尝试我自己转换它,我想得到一些帮助,所以我尽可能减少错误。

这来自 dhtmlx 库,它基本上是一个甘特图,我需要将其包含在我们的一个项目中。任何帮助将不胜感激,所以提前感谢!