问题标签 [react-16]

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

reactjs - 反应:从组件中返回一个数组,键值问题

注意:我确实了解keys数组的重要性。通常我使用 .map 重复数组并使用index变量.map提供。就我而言,我无法访问任何索引变量。我想知道比手动添加密钥更好的方法。

所以我这样做了:

这会引发错误

警告:数组或迭代器中的每个孩子都应该有一个唯一的“key”道具。有关更多信息,请参阅https://reactjs.org/docs/lists-and-keys.html#keys。在 BComponent 中(由 AComponent 创建)

所以我需要更改BComponent为:

当然,这不是解决此问题的最佳方法。我想知道什么是更好的方法?或者这是来自 React 的错误?

0 投票
1 回答
82 浏览

reactjs - 在 React 中使用来自购买主题的自定义脚本

我正在将 HTML 重构为 React。HTML 使用购买的主题,该主题依赖于一些自定义 JS 文件,包括 jQuery。如何将自定义脚本链接到 React 中的组件?我是否将它们链接到公用文件夹中的 index.html 文件中?还是我需要在每个组件文件中链接它们?

0 投票
0 回答
96 浏览

javascript - 使用 React 16 App 中的 React 14 组件

我们使用了一个 React 组件包,它提供了一些可重用的组件,例如 Button、Form、TreeView 等……该包是在 React 14 之上开发的。

我们想使用 React 16 开发一个新的应用程序并利用这个组件包,因为它提供了很多开箱即用的外观和感觉。

我们的代码如下所示。

使用此代码,当我打开页面时,我收到一条错误消息,提示 TypeError: o.PropTypes is undefined in the browser console。我相信“o.PropTypes”是“React.PropTypes”的混淆版本,我收到此错误是因为在 Button 组件的源代码中某处他们使用了“React.PropTypes”,这在 React 14 之后变得无效。

另一件事是,当我不使用 Button 并且根本不导入它时,一切正常。所以,我很确定问题是由 Button 组件引起的。

我在 index.js 中尝试了以下内容,但没有帮助。

有没有办法从 React 16 应用程序中使用 React 14 组件?在最坏的情况下,我们将降级到 14,因为该库尚不支持 16,但我们真的想避免它。

0 投票
2 回答
356 浏览

javascript - React 中 setState 变化的传播

我有一个具有以下结构的 React 应用程序:

组件ABC组成

如果我调用setState组件B,是否还会通知组件AC(这意味着它们也会重新渲染,至少进入协调阶段)?

0 投票
1 回答
301 浏览

reactjs - 如何使用 Karma 和 React 16.2.0 修复此错误?

我有这个 Karma 配置(使用 React 16.2.0):

我收到以下控制台错误:

{ "message": "Uncaught ReferenceError: addons is not defined\nat test/allTests.js:81672:8\n\nReferenceError: addons is not defined\n
at Object.defineProperty.value (test/allTests.js:84455: 18)\n 在 webpack_require (test/allTests.js:20:30)\n 在 test/allTests.js:81668:20\n 在 Object.defineProperty.value (test/allTests.js:81732:6)\n在webpack_require (test/allTests.js:20:30)\n 在 Object. (test/allTests.js:79742:21)\n 在 Object. (test/allTests.js:80112:31)\n 在webpack_require ( test/allTests.js:20:30)\n 在 Object. (test/allTests.js:77771:15)\n 在webpack_require (test/allTests.js:20:30)", "str": "Uncaught ReferenceError: addons is not defined\nat test/allTests.js:81672:8\n\nReferenceError: addons is not defined\n
at Object. defineProperty.value (test/allTests.js:84455:18)\n 在 webpack_require (test/allTests.js:20:30)\n 在 test/allTests.js:81668:20\n 在 Object.defineProperty.value ( test/allTests.js:81732:6)\n 在webpack_require (test/allTests.js:20:30)\n 在 Object. (test/allTests.js:79742:21)\n 在对象。(test/allTests.js:80112:31)\n 在webpack_require (test/allTests.js:20:30)\n 在 Object. (test/allTests.js:77771:15)\n 在webpack_require (test/allTests.js:20:30)" }

这个错误的根源是什么?

0 投票
1 回答
17 浏览

performance - 如何在 DevTools 中识别火焰图中执行的时刻?

我正在使用 React 16(光纤引擎),需要查看/识别主线程部分中的特定时刻,以查看之后发生的情况。

因此,我想出了一些想法,将一些代码放在那里会产生一些峰值,并使我能够在图表上看到开始发生某些事情的确切位置。

如何在 DevTools 中识别火焰图中执行的时刻?

0 投票
1 回答
15392 浏览

reactjs - 在 React 16.2 中出现意外令牌错误的片段

我有以下呈现一系列组件的组件。但是,我下载了 React 16.2 并尝试使用片段而不是 div,但出现以下错误:

当片段应该能够替换 React 16.2 中的 div 时,为什么会出现此错误?

0 投票
1 回答
189 浏览

javascript - componentDidCatch() 是否从绑定到组件的承诺或事件处理程序中捕获错误

在 React 16 上,假设我有一个组件

}

然后在我做的构造函数中this.onClick = this.onClick.bind(this)。错误会被捕获componentDidCatch()吗?

0 投票
2 回答
1507 浏览

reactjs - React 16v - 未捕获的类型错误:无法读取未定义的属性“布尔”

我将项目的 react 版本从 15.3.1 更新到 16.2.0。我收到以下运行时错误消息。

我逐渐进行了更新,该应用程序在 15.6.2 中运行良好。在我将其更新到 16.0.0 后,该错误开始出现。我将它更新到 16.2.0 希望它能解决它。但没有运气。我的 webpack.config.js 和 package.json 在下面

包.json

webpack.config.js

有关如何解决此问题的任何想法。提前致谢 :)

0 投票
1 回答
374 浏览

javascript - 在 React16 的长字符串中间添加一个省略号

我正在尝试将省略号添加到字符串的中点,并具有以下复杂性:

  • 我不知道字符串要多长
  • 我只知道父元素的最大宽度和最小宽度
  • 字符串可能适合也可能不适合它的父级并且不需要省略号

我在这里有一个plunk来说明它。该脚本仅假定一个实例,但您应该明白:

这有点笨拙,但证明了这个想法。

我在 React 16 中遇到的问题是字符串没有在我需要测量它以在最后创建文本位的点呈现。因此,当新节点被创建时,它没有维度并且无法测量,因为它不存在于 DOM 中。

该功能起作用 - 有点像屏幕调整大小,但这不是重点。我需要让它在渲染时完成。

实际的应用程序是专有的,我不能在这个论坛上分享我的任何代码。

编辑:要记住的另一件事(在这里教吸鸡蛋)是,在示例中,仅渲染 DOM 后加载脚本,因此所需的所有信息都已经存在并且可以测量。