0

enter image description here

when I log any string in App component or Quiz component it appears two times in console.

Ahmed_Saied
  • 59
  • 1
  • 7
  • 1
    related: https://stackoverflow.com/questions/68291908/why-is-promise-then-called-twice-in-a-react-component-but-not-the-console-log – Giorgi Moniava Apr 19 '22 at 21:17

1 Answers1

0

This is because you are using StrictMode, which will cause multiple renders. This in intentionally done to help encourage developers use side effects properly. The double render will only happen in development and not in production.

Also see this answer for more information.

Strict mode is on because you have your components wrapped with <React.StrictMode>:

<React.StrictMode>
    <Router>
        ...
        ...
</React.StrictMode>
Andrew Hulterstrom
  • 1,563
  • 4
  • 18
  • 1
    I'm not sure why your answer was downvoted, but it _might_ be because of the _question_ not necessarily your _answer_. It's usually discouraged to answer questions that should be closed—in this case, either because the question is low quality (e.g., due to embedding code as an image), or because it's a duplicate. As far as I recall, part of that is because closed questions without any positive-scored answers will be automatically deleted after some time as part of clean-up processes, so downvoting further helps ensure that occurs. – Jeremy Caney Apr 19 '22 at 21:34
  • Good to know, thank you Jeremy – Andrew Hulterstrom Apr 19 '22 at 21:36
  • Might be because this is a duplicate question and this answer effectively links to another answer. – Drew Reese Apr 19 '22 at 21:36
  • Is linking to other answers frowned upon? I'm still a bit new here sorry – Andrew Hulterstrom Apr 19 '22 at 21:37
  • Not generally. If a question isn't a duplicate and a linked answer is only explaining a portion of the issue/solution (*i.e. clarifies so you don't duplicate effort*) and your answer adds helpful and relevant information, I don't think anyone would consider that unwelcome. `React.StrictMode` just happens to be one of those things that gets asked about a lot. Same with the "React state isn't updating immediately. Why?" sort of questions. – Drew Reese Apr 19 '22 at 21:41
  • @AndrewHulterstrom: It's totally fine to link to another answer for additional information or e.g. alternate approaches. If a question can be solved by an existing answer on another question, however, it's better to flag the question as a duplicate. Further, if you _do_ post an answer, it should still be self-contained and customized to the specifics of the question, instead of relying _primarily_ on the link, or just reiterating what's already stated in the linked answer. – Jeremy Caney Apr 19 '22 at 21:42
  • Makes sense, thank you! – Andrew Hulterstrom Apr 19 '22 at 21:43