Skip to main content
44 questions
Newest Active Bountied Unanswered
Filter by
Sorted by
Tagged with
-5 votes
1 answer
105 views

this is my code for a vite react + ts calendar import Day from "./Day"; import style from "./Calendar.module.css"; import { useState } from "react"; import type { ...
Jakub Kowalski's user avatar
  • 5
0 votes
1 answer
39 views

In an electron-vite, React, typescript app, I'm using a Router with paths to a series of pages, each of which returns a <RootLayout. ReactDOM.createRoot(document.getElementById('root') as ...
James Newton's user avatar
  • 785
1 vote
2 answers
120 views

I am currently working on a pokemon team builder. The issue I have is the following: On my SelectedTeamBanner component I have an effect that should check if user has any team stored on localStorage. ...
Horacio García Magallanes's user avatar
  • 40
0 votes
1 answer
66 views

I was walking through some code and came across the following snippet to prevent StrictMode from calling an effect twice. While it's generally not recommended to implement such a feature, I was more ...
Kipnoedels's user avatar
  • 1,456
1 vote
0 answers
30 views

I'm new to React and found a strange behavior inside useLayoutEffect function in my custom context (AuthContext - simple context to work with jwt and refresh token). The problem: axios inside ...
Quikler's user avatar
  • 190
0 votes
0 answers
31 views

The question/solution already employs what I think is proper cleanup for the double mount for the StrictMode highlighted in simlar question. Below is simplified example. The real code works with event ...
Arman P.'s user avatar
  • 4,414
1 vote
1 answer
68 views

What will be the output of the following component under react strict-mode? import { useEffect } from "react"; export default function Learn() { let x = 1; console.log("outside ...
Robin Roy's user avatar
  • 11
-2 votes
1 answer
96 views

I have a simple React application in which the index.js file looks like this: import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; const ...
gib65's user avatar
  • 2,039
1 vote
1 answer
51 views

The component is from React's official documentation's section Keeping Components Pure. let guest = 0; function Cup() { // Bad: changing a preexisting variable! guest = guest + 1; return &...
Matthew Gong's user avatar
  • 53
0 votes
4 answers
3k views

I heard that it is not a good practice to call an api inside useEffect, also thats why in dev mode useEffect runs twice.I am not sure about it, but if not useEffect, then what else? Need fellow devs ...
Abdullah Ibrâhim's user avatar
  • 21
1 vote
1 answer
43 views

Does that mean that I am doing something wrong? I thought strict mode was to help you find side effects. If I turn off strict mode I get the quantity updated correctly (once per click). With strict ...
user3146945's user avatar
  • 307
1 vote
0 answers
541 views

I have this Skip component to conditionally skip pages. I noticed that instead of skipping ONE page, it skips two pages! I suspected that it might be the Strict Mode running the UseEffect code twice. ...
Aslan's user avatar
  • 155
2 votes
0 answers
69 views

I have a react component that receives an array of strings (facts). The component cycles through the array and displays each fact individually. Each fact is presented letter by letter as though being ...
AdaCra's user avatar
  • 63
1 vote
1 answer
6k views

We use antd 4.22.8 in our project and upgraded React from 17 to 18 recently. At this point, some antd basic stuff (such as tooltips and checkboxes) stopped to work under certain circumstances in ...
ezze's user avatar
  • 4,150
1 vote
2 answers
57 views

I know that change in state triggers re-rendering of component. So my question is that, does change in state also unmount function component as part of re-rendering process? main.jsx const Fullnote = (...
Vishal Sangole's user avatar
  • 59
1 vote
1 answer
681 views

I'm trying to explain to another engineer how React StrictMode works - with specific reference to double renders, intervals and useEffect cleanups. Take the following simple counter component: const ...
glo's user avatar
  • 839
0 votes
1 answer
40 views

I was reading the official docs on: https://react.dev/learn/keeping-components-pure#detecting-impure-calculations-with-strict-mode It talks about using: <StrictMode> <App /> </...
Stefanie Gauss's user avatar
  • 787
0 votes
1 answer
35 views

Expected to return a value at the end of arrow function , this is a common problem one can face easily while using react JSX in strict mode contentType = id => { console.log('') if (id === '...
Avik Biswas's user avatar
  • 19
2 votes
1 answer
807 views

const { createRoot } = ReactDOM; const { StrictMode, useEffect, useState } = React; function Test() { const [count, setCount] = useState(0); useEffect(() => { setCount((prevCount) => ...
Wing's user avatar
  • 9,810
0 votes
1 answer
982 views

const { Fragment, StrictMode, useRef, useState } = React; const { createRoot } = ReactDOM; function CountLabel({ count }) { const prevCount = useRef(count); console.log("prevCount: ", prevCount....
shikher prasad's user avatar
  • 1
2 votes
1 answer
951 views

I am creating a fabric canvas and buttons that instantiate shapes that should be selectable. I don't understand why my component is being re-rendered twice in the following scenario. Because of this ...
Kronax's user avatar
  • 79
0 votes
1 answer
321 views

Before removing strictmode index.js import React from "react"; import ReactDOM from "react-dom/client"; import App from "./App"; const root = ReactDOM.createRoot(...
PARKHEECHANG's user avatar
  • 13
0 votes
2 answers
268 views

I am new to react. This is a generated code block in my project by create-react-app const container = document.getElementById("root"); const root = createRoot(container); root.render( <...
Trouble Lee's user avatar
  • 21
1 vote
1 answer
301 views

I have react code that works like so: const [screenStream, setScreenStream] = useState(null); useEffect(() => { getPermissionsAndStreams(); }, []); const getPermissionsAndStreams = () ...
Will Taylor's user avatar
  • 2,324
1 vote
0 answers
106 views

The following React component is rendered every 50ms. The value of s increases by 1 every second. When it does, I'd like to add the value of word to an array in state. When the code runs, the word ...
Cirrocumulus's user avatar
  • 628
0 votes
2 answers
2k views

I just updated to React 18 and I noticed that the useEffect runs twice which makes my socket.io code fail connection. What could be the solution for this? Here is my useEffect: useEffect(() => { ...
Angel Hadzhiev's user avatar
  • 1,046
0 votes
0 answers
874 views

I've found Why is my React component is rendering twice? which fixed my coding error (setState getting called X times depending in which component it gets called), but do I have a problem with my code ...
Cinc-B's user avatar
  • 141
14 votes
1 answer
12k views

I was reading the doc and learned that React StrictMode is for development only, and it explains why we have double invoke. That's great, but does it mean I have to disable the StrictMode manualy for ...
Johan's user avatar
  • 3,106
23 votes
2 answers
72k views

Simply, how can I disable Strict Mode in React 18? I'm using React 18 with create-react-app.
user avatar
6 votes
1 answer
2k views

another React 18 strict mode question. I'm aware React will call the render and effect functions twice to highlight potential memory leaks with the upcoming features. What I yet don't understand is ...
fragsalat's user avatar
  • 548
10 votes
2 answers
7k views

I have my app inside a Strict Mode and it makes it difficult to run with my useEffect(). It basically logs all my values twice in the console which is not the result I want to achieve. useEffect(() =&...
Metgher Andrei's user avatar
  • 227
17 votes
1 answer
11k views

Is there a way in React -- either in code or via the React devtools -- to see if a component is being rendered in React's StrictMode? In my dream world, there would be some kind of constant I could ...
Erdős-Bacon's user avatar
  • 978
27 votes
6 answers
46k views

The changes to strict-mode in React version 18 causes my code to render twice, which causes an error in axios abort controller, but I don't know how to clear the error from the browser console after ...
Ifeanyi Chima's user avatar
  • 821
0 votes
1 answer
1k views

Is there any way to know whether the strict mode is enabled in React? useEffect(() => { if(strictModeEnabled) {} }) I didn't find any information in the docs.
undefined's user avatar
  • 6,974
12 votes
2 answers
11k views

Consider the snippets below. With React 18, count gets printed twice to the console on every render but with React 17 it gets printed only once. React 18 Example: function App() { const [count, ...
Developer's user avatar
  • 495
3 votes
2 answers
703 views

I am working on my project and i noticed that when strict mode is turned on it pushes two identical elements into my array. When the strict mode is off it pushes only one element into the array. Is ...
ProHunter67's user avatar
  • 33
15 votes
3 answers
5k views

I'm using useRef to hold the latest value of a prop so that I can access it later in an asynchronously-invoked callback (such as an onClick handler). I'm using a ref instead of putting value in the ...
jtbandes's user avatar
  • 119k
10 votes
1 answer
3k views

First time posting a question :) I have a React application with: // index.js ReactDOM.render( <React.StrictMode> <Router> <App /> </Router> </React....
Willow's user avatar
  • 1,475
33 votes
1 answer
23k views

Draggable package is causing an error in strict mode: Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DraggableCore which is inside StrictMode. Instead, add a ...
Francesco Orsi's user avatar
  • 2,129
16 votes
3 answers
57k views

This is brand new install - I have not put any transitions on the Alert component To replicate the code it is simple import React from "react"; import { Alert } from "reactstrap"; export const ...
Michael Nelles's user avatar
  • 6,058
283 votes
7 answers
210k views

My React Component is rendering twice. So, I decided to do a line-by-line debug, and the problem is here: if ( workInProgress.mode & StrictMode) { instance.render(); } React-dom....
Marry Joanna's user avatar
  • 2,833
167 votes
15 answers
387k views

I am trying to use a function as a prop inside a component and this component is a child of another component. But the function is not working.? Can I know why. This is the warning i am receiving in ...
Niroshan_Krish's user avatar
  • 1,742
18 votes
3 answers
6k views

We use strict mode in our React app. But third parties does not use strict mode. How can I achieve this?
babbego's user avatar
  • 181
95 votes
4 answers
93k views

I heard that strict mode helps to write React code in best practices way by throwing warnings for life cycle methods removal. I read about it from this article on Medium. Is my understanding correct? ...
Hemadri Dasari's user avatar
  • 34.2k