📜  React 中的 StrictMode 是什么?

📅  最后修改于: 2022-05-13 01:56:20.897000             🧑  作者: Mango

React 中的 StrictMode 是什么?

StrictMode 是一个 React 开发工具,主要用于突出显示 Web 应用程序中可能存在的问题。它为其子组件激活额外的弃用检查和警告。它受欢迎的原因之一是,只要不遵循 React 指南和推荐的实践,它就会提供视觉反馈(警告/错误消息)。就像 React Fragment 一样,React StrictMode 组件不会呈现任何可见的 UI。

React StrictMode 可以被视为一个帮助组件,它允许开发人员高效地编码,并提醒他们注意可能意外添加到应用程序中的任何可疑代码。 StrictMode 可以应用于应用程序的任何部分,不一定适用于整个应用程序。在开发新代码或调试应用程序时使用它特别有用。

例子:

Javascript
import React from 'react';
  
function StictModeDemo() {
  return (
    
                                                                        
  ); }


说明:在上面的示例中,StrictMode 检查将仅适用于 Component2 和 Component3(因为它们是 React.StrictMode 的子组件)。与此相反,Component1 和 Component4 不会有任何检查。

优点: React StrictMode 有助于在开发阶段识别和检测各种警告/错误,即 -

  1. 帮助识别那些生命周期不安全的组件:一些遗留组件生命周期方法被认为在异步应用程序中使用是不安全的。 React StrictMode 有助于检测此类不安全方法的使用。启用后,它会显示使用不安全生命周期方法的所有组件的列表作为警告消息。
  2. 对遗留字符串引用 API 的使用发出警告:最初,有两种方法来管理引用 - 遗留字符串引用 API 和回调 API。后来,添加了第三种替代方法 createRef API,将字符串refs 替换为 object refs,这允许 StrictMode 在使用字符串 refs 时发出警告消息。
  3. 关于使用已弃用的 findDOMNode 的警告:由于 findDOMNode 只是一个一次性读取 API,因此当子组件尝试渲染不同的节点(父组件渲染的节点除外)时,无法处理更改。 React StrictMode 检测到这些问题并显示为警告消息。

要记住的其他要点:

  • 由于 StrictMode 是一个开发工具,它只在开发模式下运行。它不会以任何方式影响生产构建。
  • 为了识别和检测应用程序中的任何问题并显示警告消息,StrictMode 将应用程序内的每个组件呈现两次。