React严格模式-React.StrictMode
Posted 提莫找蘑菇
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了React严格模式-React.StrictMode相关的知识,希望对你有一定的参考价值。
前言
因为才开始学习关于React的开发,所以很多时候会遇见一些未曾用过的API、方法等。因此将这些知识点记录下来,也可以供同我一样的新入门童鞋学习。
因为目前做的项目是直接上手公司现有的React项目,就用到的一些API可能就是洗项目中显有的,而今天看见一个标签 <React.StrictMode>
,在目前项目中也没有出现,就在想这个是不是和javascript
中的严格模式“use strict”一样呢?那本着不懂就问的原则,开始了今天的知识学习。
严格模式(Strict Mode)
严格模式在官网中这样介绍:
StrictMode 是一个用以标记出应用中潜在问题的工具。就像 Fragment ,StrictMode 不会渲染任何真实的UI。它为其后代元素触发额外的检查和警告。
注意: 严格模式检查只在开发模式下运行,不会与生产模式冲突。
你可以在代码的任何地方启用严格模式。例如:
// 文件入口
React.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById("root")
)
// 单个组件中
import React from "react";
function Home() {
return (
<div className="home">
<React.StrictMode>
<ComponentTable />
<ComponentDialog />
</React.StrictMode>
<CommonInfo />
</div>
)
}
上述栗子
以上是关于React严格模式-React.StrictMode的主要内容,如果未能解决你的问题,请参考以下文章
如何在使用 webpack 捆绑 React 时禁用严格模式
React 16.13.1开启严格模式会触发两次render
React 16.13.1开启严格模式会触发两次render