为什么使用组件策略时react中的render函数会被调用两次？

Question

我是新手，我不了解为什么 console.log 在渲染函数内部被调用两次？

import React, { Component } from "react";
import "./App.css";

class App extends Component {

  render() {
    console.log("Prints twice in console");
    return (
      <div className="App">

      </div>
    );
  }
}

export default App;

就好像我没有从组件扩展而是使用函数而是控制台只打印一次

import React from "react";
import "./App.css";
function App() {
  console.log("prints once");
  return <div className="App"></div>;
}

export default App;

Answer 1

在 ./src 目录中检查您的 index.js。我认为它在

中呈现 App 组件

<React.StrictMode>

删除它，它将停止渲染函数两次。

你也可以检查This

为什么使用组件策略时react中的render函数会被调用两次？

Why does the render function in react is called twice when using the component strategy?

reactjs

react-component