React: Each Class is executing two times in react version 16.13.1

Created on 29 Jul 2020  路  2Comments  路  Source: facebook/react

React version: 16.13.1
React Script Version: 3.4.1

Steps To Reproduce

  1. Just create a new project using command npx create-react-app
  2. Convert functional component to Class component in App.js
  3. Add a console log before "return" statement.
  4. then run command "npm start"
  5. In the console in browser, you will see console log was printed two times.

Link to code example: https://github.com/radhey7705/React-Project.git

The current behavior

after run npm start, Class component is working two times

The expected behavior

after run npm start, Class component should only work single time.

Unconfirmed

Most helpful comment

This is intentional, as mentioned above 馃槃 so I am going to close this issue.

Thanks for leaving the link, @Reflex-Gravity

All 2 comments

In Strict Mode, react intentionally double-invokes constructor, render, and shouldComponentUpdate.
It helps to detect unexpected side effects.

More details in the below link:
https://reactjs.org/docs/strict-mode.html#detecting-unexpected-side-effects

This is intentional, as mentioned above 馃槃 so I am going to close this issue.

Thanks for leaving the link, @Reflex-Gravity

Was this page helpful?
0 / 5 - 0 ratings