CODEWITHSUNDEEP
reactjs
Bony
Bony

Reputation: 181

ReactJS output console log duplicate

When i write console.log('constructor') in class's constructor, the output duplicates the rendering. code rendering

Upvotes: 2

Views: 4614

Answers (3)

Obed Parlapiano
Obed Parlapiano

Reputation: 3702

If you're on development mode, try disabling "strict mode". On dev mode Reach renders components twice to make dev-only checks and tests to warn you of errors. https://github.com/reactwg/react-18/discussions/96#discussion-3562310

If you're not on dev mode:

This has nothing to do with the console.log duplicating the rendering. It's impossible that it may cause that, because console logging something doesn't affect a component's state, and it won't trigger a new render.

It's normal that components render more than once in a lot of cases

  • Do you have any code updating state in your component? Like inside componentDidMount or anywhere else?
  • Is a parent of this component updating state anywhere? If so, it will cause itself to re-render, which includes its children re-rendering too.

In short, this is not being caused by your console log. If you remove it you won't "see" the double render because it happens fast and you don't have a point of reference (like a log in your console), but it still happens.

Upvotes: 6

Ningaro
Ningaro

Reputation: 149

You can disable doubled comments with React Developer Tools browser extension

React Developer Tools screenshot

Upvotes: 10

Bony
Bony

Reputation: 181

To solve the problem you have to disable the strict react mode in index.js

Upvotes: 9

Related Questions