React / Reactstrap 警告：在严格模式树中检测到旧版上下文 API

Posted 2023-02-21

【中文标题】React / Reactstrap 警告：在严格模式树中检测到旧版上下文 API

【英文标题】：React / Reactstrap Warning: Legacy context API has been detected within a strict-mode tree

【发布时间】：2020-08-22 03:47:20

【问题描述】：

这是全新安装 - 我没有在警报组件上添加任何过渡

复制代码很简单

import React from "react";
import  Alert  from "reactstrap";

export const Index = () => 
   return (
      <div>
         <Alert color='primary'>This is a primary alert — check it out!</Alert>
      </div>
   );
;

错误消息：请更新以下组件：Transition

如何更新Transition 或将其全部删除？

【参考方案1】：

如果有人在搜索问题后来到这里并正在寻找洞察力，就是这样。

React 表带（在本文发布时）使用 react-transition-group 东西淡入淡出，菜单上下滑动。在合并此处和 Github 上有关此主题的信息后，他们目前正在更新库。我已经通过忽略警告完成了该组件的编码。

它并没有阻碍该组件的迭代。快乐编码。

【讨论】：

我没有使用 reactstrap 但仍然出现此错误。有什么想法吗？

我最好的猜测是存在未正确编译的依赖库或存在安全风险。尝试使用 ncu -u 更新您的 package.json，然后运行 ​​npm i (ncu = node-check-updates) npmjs.com/package/npm-check-updates

【参考方案2】：

已报告此问题，并且显然已修复，但即使使用更新的源代码，我也收到相同的错误。这不仅仅是错误 - 它可能导致组件重新渲染

这是来自 reactstrap 存储库的一个 github 线程（但有很多）：https://github.com/reactstrap/reactstrap/issues/1340

虽然有许多与此警告相关的问题。

据我所知，它与 Transition.js 中的一个项目有关，我认为它可能与组件“进入”时的 this.context 调用有关

但是，我遇到这个问题的项目是我正在构建的第一个 React 应用程序，而且我还没有准备好学习 Legacy Context API，所以这只是我最好的猜测，最后我只是选择了一个替代包。

我没有代表将此放在评论中，所以我唯一的答案是：

向 reactstrap 团队报告问题并等待/协助修复 使用替代包

【参考方案3】：

我有同样的警告，我修复了它在index.js 文件中的更改，将<React.StrictMode> 的值更改为<React.Fragment>。 由于这消除了警告，因此不能保证您可以防弹。

【讨论】：

这不是“修复它”！沉默！=静音

投反对票，因为这个答案提倡不良做法。

<React.StrictMode> 仅在不处于生产模式时记录，因此删除它没有任何效果，除了在开发模式下隐藏有用的弃用/警告日志。如果你想删除它，只需删除它而不是用片段替换它。

fyi，你提到的 2 个标签不相关。如果你用 DIV 标签替换它，你会得到相同的结果。错误消失了，因为你删除了 StrictMode 标签